大家好,又見面了,我是全棧君。
首先,我們先來建立主界面的布局檔案
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<FrameLayout
android:id="@+id/fragment_container"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_above="@+id/group_tab"/>
<RadioGroup
android:id="@+id/group_tab"
android:layout_width="match_parent"
android:layout_height="50dp"
android:layout_alignParentBottom="true"
android:background="#FBFBFB"
android:orientation="horizontal">
<RadioButton
android:id="@+id/rb_watch"
style="@style/main_tab_style"
android:drawableTop="@drawable/select_tab_watch"
android:text="高速全覽"/>
.......省略
<RadioButton
android:id="@+id/rb_event"
style="@style/main_tab_style"
android:checked="true"
android:drawableTop="@drawable/select_tab_event"
android:text="事件管理"/>
</RadioGroup>
</RelativeLayout>
複制
可以看到,我們将最後一個先設定為選中狀态,在Activity中再進行狀态的切換
四個RadioButton的屬性大多都是一樣的,是以抽取到
styles
<style name="main_tab_style">
<item name="android:layout_width">0dp</item>
<item name="android:layout_height">match_parent</item>
<item name="android:layout_weight">1</item>
<item name="android:button">@null</item>
<item name="android:textSize">12sp</item>
<item name="android:textColor">@drawable/select_tab_text_color</item>
<item name="android:layout_marginTop">5dp</item>
<item name="android:drawablePadding">3dp</item>
<item name="android:gravity">center</item>
</style>
複制
還有
drawableTop
和
text
相應的Seletor
select_tab_bus.xml
這裡隻列出了一個,其他三個隻是圖檔不同就不列出來了
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="@drawable/tab_bus_pre" android:state_pressed="false" android:state_selected="true" />
<item android:drawable="@drawable/tab_bus_pre" android:state_checked="true" android:state_pressed="false" />
<item android:drawable="@drawable/tab_bus_nomal" />
</selector>
複制
select_tab_text_color.xml
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_checked="true" android:color="#2e9ed0"/>
<!-- not selected -->
<item android:state_checked="false" android:color="#B2B2B2"/>
</selector>
複制
到這裡我們的布局就準備好了,接下來開始編寫Fragment與Activity的代碼。
fragment代碼很簡單,如下,
public class MainExpresswayWatchFragment extends Fragment {
@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
Bundle savedInstanceState) {
View view = inflater.inflate(R.layout.fragment_common, container, false);
TextView tvContent = (TextView) view.findViewById(R.id.tv_content);
tvContent.setText("高速全覽");
return view;
}
@Override
public void setMenuVisibility(boolean menuVisible) {
super.setMenuVisibility(menuVisible);
// 每個Fragment都需要實作`setMenuVisibility`來控制視圖,
// 當Fragment不可見的時候,需要隐藏相應的視圖,不然會使界面重疊在一起。
if (this.getView() != null) {
this.getView().setVisibility(menuVisible ? View.VISIBLE : View.GONE);
}
}
}
複制
接下來是Activity的代碼,關鍵代碼都有注釋,我就不多說了…
public class MainActivity extends AppCompatActivity implements RadioGroup.OnCheckedChangeListener {
private RadioGroup radioGroup;
private FrameLayout fragmentContainer;
// 是否第一次進入主界面
private boolean isFirstEnter = true;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_radio_group_main);
radioGroup = (RadioGroup) findViewById(R.id.group_tab);
fragmentContainer = (FrameLayout) findViewById(R.id.fragment_container);
radioGroup.setOnCheckedChangeListener(this);
}
@Override
protected void onStart() {
super.onStart();
if (isFirstEnter) {
isFirstEnter = false;
// 準備顯示界面的時候切換第一個RadioButton為選中狀态
radioGroup.check(R.id.rb_watch);
}
}
@Override
public void onCheckedChanged(RadioGroup radioGroup, int i) {
int index = 0;
switch (i) {
case R.id.rb_watch:
index = 0;
break;
case R.id.rb_bus_danger:
index = 1;
break;
case R.id.rb_car:
index = 2;
break;
case R.id.rb_event:
index = 3;
break;
}
// 從FragmentManager中查找Fragment,找不到就使用getItem擷取
Fragment fragment = (Fragment) fragments.instantiateItem(fragmentContainer, index);
// 設定顯示第一個Fragment
fragments.setPrimaryItem(fragmentContainer, 0, fragment);
// 送出事務
fragments.finishUpdate(fragmentContainer);
}
// 使用FragmentStatePagerAdapter管理Fragment
FragmentStatePagerAdapter fragments = new FragmentStatePagerAdapter(getSupportFragmentManager()) {
@Override
public Fragment getItem(int position) {
Fragment fragment = null;
switch (position) {
case 0:
fragment = new MainExpresswayWatchFragment();
break;
case 1:
fragment = new MainBusDangerFragment();
break;
case 2:
fragment = new MainCarManageFragment();
break;
case 3:
fragment = new MainEventDangerFragment();
break;
}
return fragment;
}
@Override
public int getCount() {
return 4;
}
};
}
複制
釋出者:全棧程式員棧長,轉載請注明出處:https://javaforall.cn/108869.html原文連結:https://javaforall.cn