1、使用RadioButton實現下方導航欄
上方圖片，下面文字；點擊切換圖片；
首先布局xml文件：
<RadioGroup android:id="@+id/radioGroup1" android:layout_margin="5dp" android:orientation="horizontal" android:layout_width="match_parent" android:layout_height="wrap_content"> <RadioButton android:id="@+id/radio1" android:button="@null" android:drawableTop="@drawable/navbar1" android:gravity="center" android:layout_weight="1.0" android:layout_width="wrap_content" android:layout_height="wrap_content" android:textSize="14dp" android:text="微信"/> <RadioButton android:id="@+id/radio2" android:textSize="14dp" android:textColor="@drawable/color" android:button="@null" android:drawableTop="@drawable/navbar2" android:gravity="center" android:layout_weight="1.0" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="通訊錄"/> <RadioButton android:id="@+id/radio3" android:textSize="14dp" android:textColor="@drawable/color" android:button="@null" android:drawableTop="@drawable/navbar3" android:gravity="center" android:layout_weight="1.0" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="發現"/> <RadioButton android:id="@+id/radio4" android:textSize="14dp" android:textColor="@drawable/color" android:button="@null" android:drawableTop="@drawable/navbar4" android:gravity="center" android:layout_weight="1.0" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="我的"/> </RadioGroup>
然后，如何點擊按鈕 更換背景圖片：
在drawable里面創建xml文件
<selector xmlns:android="http://schemas.android.com/apk/res/android"> <!--圖片切換--> <item android:drawable="@mipmap/char2" android:state_checked="true"/> <item android:drawable="@mipmap/char1" android:state_checked="false"/> </selector>
在設置背景圖片的時候，不指定到一張圖片，而是指定到一個xml文件
android:drawableTop="@drawable/navbar1"
設置文字顏色改變可以用這個方法，也可以使用事件監聽：（代碼中，為了測試，第一個按鈕為事件監聽，其他為使用XML）
/*使用監聽器把第一個字體的顏色改變*/ radio1.setOnCheckedChangeListener(new CompoundButton.OnCheckedChangeListener() { @Override public void onCheckedChanged(CompoundButton buttonView, boolean isChecked) { if(radio1.isChecked()){ radio1.setTextColor(Color.parseColor("#08bf62")); } else{ radio1.setTextColor(Color.parseColor("#000000")); } } });
2、點擊切換頁面：fragment , 注1：這里為動態fragment
首先建如圖fragment： 注：建立fragment時會有版本問題，以下使用老的版本import android.app.Fragment; jar包： compile 'com.android.support:support-v4:24.0.0'
注2：
在主界面XML編寫：
<FrameLayout android:id="@+id/frameLayout" android:layout_weight="1" android:layout_width="match_parent" android:layout_height="match_parent"> </FrameLayout>
設置事件監聽：
FrameLayout frameLayout; CharFragment charFragment=null; ContactFragment contactFragment=null; FindFragment findFragment=null; MeFragment meFragment=null;
/*Frame布局的切換監聽*/ radioGroup1.setOnCheckedChangeListener(new RadioGroup.OnCheckedChangeListener() { @Override public void onCheckedChanged(RadioGroup group, int checkedId) { if (checkedId ==R.id.radio1){ //綁定Fragment if(charFragment==null){ charFragment=new CharFragment(); } getFragmentManager().beginTransaction().replace(R.id.frameLayout,charFragment).commit(); } if (checkedId ==R.id.radio2){ //綁定Fragment if(contactFragment==null){ contactFragment=new ContactFragment(); } getFragmentManager().beginTransaction().replace(R.id.frameLayout,contactFragment).commit(); } if (checkedId ==R.id.radio3){ //綁定Fragment if(findFragment==null){ findFragment=new FindFragment(); } getFragmentManager().beginTransaction().replace(R.id.frameLayout,findFragment).commit(); } if (checkedId ==R.id.radio4){ //綁定Fragment if(meFragment==null){ meFragment=new MeFragment(); } getFragmentManager().beginTransaction().replace(R.id.frameLayout,meFragment).commit(); } } });
3、微信界面的ListVIew
在fragment的xml界面打代碼：
<ListView android:id="@+id/listView" android:background="#7ecef4" android:layout_width="match_parent" android:layout_height="match_parent">
再到fragment的java文件 重寫 onViewCreated，在里面編寫：
//重寫onViewCreated @Override public void onViewCreated(View view, Bundle savedInstanceState) { super.onViewCreated(view, savedInstanceState); //重寫這里開始編寫代碼 listView=view.findViewById(R.id.listView); String[] data=new String[12]; for(int i=0;i<data.length;i++){ data[i] = "這里是內容" + i; } //獲得適配器ArrayAdapter ArrayAdapter<String> adapter=new ArrayAdapter<>(getActivity(),android.R.layout.simple_list_item_1,data); //設置適配器 listView.setAdapter(adapter); }
這時有了最簡單的界面，我們需要有自己的樣式：
新建一個char_item.xml 文件，並編寫自己的樣式：
<ImageView android:src="@mipmap/ic_launcher" android:layout_width="45dp" android:layout_height="45dp" /> <LinearLayout android:layout_width="match_parent" android:orientation="vertical" android:layout_height="50dp"> <TextView android:text="名稱" android:gravity="left|center" android:layout_width="match_parent" android:layout_height="20dp" /> <TextView android:text="內容" android:gravity="left|center" android:layout_width="match_parent" android:layout_height="30dp" /> </LinearLayout>
修改適配器：
//獲得適配器ArrayAdapter //ArrayAdapter<String> adapter=new ArrayAdapter<>(getActivity(),android.R.layout.simple_list_item_1,data); ArrayAdapter<String> adapter=new ArrayAdapter<>(getActivity(),R.layout.char_item,R.id.textView_Char,data);
//第一個參數是context,第二個是布局樣式，第三個是要捆綁的 TextView，第四個是數據
版本2：自定義ArrayAdapter
版本3 ：SimpleAdapter ：重點理解SimpleAdapter （）里面的參數
參考：http://www.cnblogs.com/loulijun/archive/2011/12/27/2303488.html
/*版本3 simpleAdapter*/ int[] headImage=new int[]{R.drawable.char1,R.drawable.char2, R.drawable.contact1,R.drawable.contact2, R.drawable.find1,R.drawable.find2, R.drawable.me1,R.drawable.me2}; List<Map<String,String>> list=new ArrayList<>();//第二個參數，為儲存的數據 for (int i = 0; i <8 ; i++) { //填充數據 Map<String,String> map=new HashMap<>(); map.put("head",String.valueOf(headImage[i])); map.put("name","這是名字"+i); map.put("content","這是內容"+i); map.put("date","懶得給時間" );//用localdate list.add(map); } String[] from =new String[]{"head","name","content","date"};//map里面的key int[] to =new int[]{R.id.icon_Head,R.id.textView_name,R.id.textView_Char,R.id.textView_Time};//控件的id SimpleAdapter simpleAdapter=new SimpleAdapter(getActivity(),list,R.layout.char_item,from,to); listView.setAdapter(simpleAdapter);//記得設置
截圖
