Android学习——特殊底部导航栏设计

    这一次要实现的是特殊的地步导航栏,如下图


    这里涉及到几个知识点,首先这里我们用到了ImageButton和FloatingActionButton控件,这里准备了四张图片作为按键的图片素材,都用PhotoShop处理成透明背景图片。


    接下来是布局代码

    

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context="com.drw.myapplication.MainActivity"
    android:background="#DDD">
    <android.support.design.widget.FloatingActionButton
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
        android:layout_centerHorizontal="true"
        android:layout_marginBottom="10dp"
        app:fabSize="normal"/>
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="70dp"
        android:layout_alignParentBottom="true"
        android:orientation="horizontal"
        android:background="#fff"
        >
        <ImageButton
            android:id="@+id/first"
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="3"
            android:padding="20dp"
            android:background="@mipmap/first_selected"
            android:onClick="first"
            />
        <ImageButton
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="2"
            android:visibility="invisible"/>
        <ImageButton
            android:id="@+id/second"
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="3"
            android:padding="20dp"
            android:background="@mipmap/second_unselected"
            android:onClick="second"/>
    </LinearLayout>
</RelativeLayout>

    FloatingActionButton的大小设置需要创建dimens.xml文件,并输入如下代码,这里的80dp是需要设置的大小,注意这里是覆盖了源码对fabsize=“normal”中normal代表的大小

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <dimen name="design_fab_size_normal">80dp</dimen>
</resources>

    然后是主类

public class MainActivity extends AppCompatActivity {
    boolean first_selected=false;
    boolean second_selected=false;
    ImageButton first;
    ImageButton second;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        first=(ImageButton)findViewById(R.id.first);
        second=(ImageButton)findViewById(R.id.second);
    }

    public void first(View v){
        if(first_selected==true) return;
        second.setBackgroundResource(R.mipmap.second_unselected);
        first.setBackgroundResource(R.mipmap.first_selected);
        first_selected=true;
        second_selected=false;
    }

    public void second(View v){
        if(second_selected==true) return;
        first.setBackgroundResource(R.mipmap.first_unselected);
        second.setBackgroundResource(R.mipmap.second_selected);
        first_selected=false;
        second_selected=true;
    }
}


   好了,这个简单的例子就到这里了,我是菜鸟,多多指教。DRW

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章