注:完整的源代码已上传至我的资源了
即:页面架构1:Fragment+RadioGroup.rar
随着接触的项目的增多,开始归纳总结一些知识点,以便以后更方便的使用与查找。
每一个项目都少不了页面框架的搭建,而到目前为止我接触的主要有三大类:
Fragment+RadioGroup ,
Fragment+LinearLayout,
Fragment + ViewPager。
先说说第一种:Fragment+RadioGroup 。
这一种使用的最多,也最方便。使用的方法步骤也是相当的easy。
话不多说,开始战斗!
1.MainActivity 对应的布局activity_main.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
tools:context="com.junmei.mobileplayer.activity.MainActivity">
<!--FrameLayout-->
<FrameLayout
android:id="@+id/fl_main_container"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1" />
<View
android:background="@color/home_back_selected"
android:layout_width="match_parent"
android:layout_height="1dp"/>
<!--RadioGroup-->
<RadioGroup
android:id="@+id/rg_main"
android:layout_width="match_parent"
android:layout_height="55dp"
android:gravity="center_vertical"
android:orientation="horizontal"
>
<RadioButton
android:id="@+id/rb_main_home"
android:button="@null"
android:drawableTop="@drawable/bg_main_home_selector"
android:layout_weight="1"
android:layout_width="0dp"
android:text="首页"
android:gravity="center_horizontal"
android:textColor="@color/color_main_text_selector"
android:layout_height="match_parent" />
<RadioButton
android:id="@+id/rb_main_invest"
android:button="@null"
android:gravity="center_horizontal"
android:drawableTop="@drawable/bg_main_invest_selector"
android:layout_weight="1"
android:layout_width="0dp"
android:text="投资"
android:textColor="@color/color_main_text_selector"
android:layout_height="match_parent" />
<RadioButton
android:id="@+id/rb_main_me"
android:button="@null"
android:gravity="center_horizontal"
android:drawableTop="@drawable/bg_main_me_selector"
android:layout_weight="1"
android:layout_width="0dp"
android:text="我的资产"
android:textColor="@color/color_main_text_selector"
android:layout_height="match_parent" />
<RadioButton
android:id="@+id/rb_main_more"
android:button="@null"
android:gravity="center_horizontal"
android:drawableTop="@drawable/bg_main_more_selector"
android:layout_weight="1"
android:layout_width="0dp"
android:text="更多"
android:textColor="@color/color_main_text_selector"
android:layout_height="match_parent" />
</RadioGroup>
</LinearLayout>
2.RadioButton 的图片选择器(放在drawable目录下):
bg_main_home_selector.xml
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="@drawable/me_pressed" android:state_checked="true"></item>
<item android:drawable="@drawable/me" android:state_checked="false"></item>
</selector>
bg_main_invest_selector.xml
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="@drawable/invest_pressed" android:state_checked="true"></item>
<item android:drawable="@drawable/invest" android:state_checked="false"></item>
</selector>
bg_main_me_selector.xml
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="@drawable/me_pressed" android:state_checked="true"></item>
<item android:drawable="@drawable/me" android:state_checked="false"></item>
</selector>
bg_main_more_selector.xml
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="@drawable/more" android:state_checked="true"></item>
<item android:drawable="@drawable/more2" android:state_checked="false"></item>
</selector>
3.RadioButton中字体颜色对应的选择器(放在color目录下)
color_main_text_selector.xml
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_checked="false" android:color="#878787"/>
<item android:state_checked="true" android:color="#18B4ED"/>
</selector>
4.下面开始写4个Fragment(),这个太easy~了,仅以一个为例
注:使用了butterknife来实例化控件对象
compile ‘com.jakewharton:butterknife:7.0.1’
HomeFragment.java代码如下:
package com.example.chenjunmei.myp2pinvest1.fragment;
import android.os.Bundle;
import android.support.annotation.Nullable;
import android.support.v4.app.Fragment;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.ImageView;
import android.widget.TextView;
import com.example.chenjunmei.myp2pinvest1.R;
import butterknife.Bind;
import butterknife.ButterKnife;
/**
* Created by JunMei on 2016/11/11.
*/
public class HomeFragment extends Fragment {
@Bind(R.id.iv_titletop_left)
ImageView ivTitletopLeft;
@Bind(R.id.tv_titletop_title)
TextView tvTitletopTitle;
@Bind(R.id.iv_titletop_setting)
ImageView ivTitletopSetting;
@Nullable
@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
View view = View.inflate(getActivity(), R.layout.fragment_home, null);
ButterKnife.bind(this, view);
initTitle();
return view;
}
private void initTitle() {
ivTitletopLeft.setVisibility(View.INVISIBLE);
ivTitletopSetting.setVisibility(View.INVISIBLE);
tvTitletopTitle.setText("首页");
}
@Override
public void onDestroyView() {
super.onDestroyView();
ButterKnife.unbind(this);
}
}
HomeFragment对应的布局fragment_home.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical" android:layout_width="match_parent"
android:layout_height="match_parent">
<include
layout="@layout/titletop"></include>
<TextView
android:text="首页"
android:textSize="50sp"
android:layout_gravity="center"
android:layout_marginTop="300dp"
android:textColor="@android:color/holo_blue_light"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</LinearLayout>
InvestFragment ,MeFragment 和 MoreFragment 写法都和 HomeFragment 基本一样,就不重复写啦~
5.压轴,最主要的就是MainActivity.java了:
package com.example.chenjunmei.myp2pinvest222;
import android.os.Bundle;
import android.support.v4.app.Fragment;
import android.support.v4.app.FragmentActivity;
import android.support.v4.app.FragmentManager;
import android.widget.RadioGroup;
import com.example.chenjunmei.myp2pinvest222.fragmeng.HomeFragment;
import com.example.chenjunmei.myp2pinvest222.fragmeng.InvestFragment;
import com.example.chenjunmei.myp2pinvest222.fragmeng.MeFragment;
import com.example.chenjunmei.myp2pinvest222.fragmeng.MoreFragment;
import butterknife.Bind;
import butterknife.ButterKnife;
/**
* By Junmei
* Date:2016-11-12
* 页面框架:Fragment + RadioGroup
*/
public class MainActivity extends FragmentActivity {
@Bind(R.id.rg_main)
RadioGroup rgMain;
private HomeFragment homeFragment;
private InvestFragment investFragment;
private MeFragment meFragment;
private MoreFragment moreFragment;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
ButterKnife.bind(this);
//写代码的一般逻辑:初始化视图-->初始化数据-->初始化监听,这样就不容易出错了
// initView();
initData();
initLintener();
}
//先初始化Fragment数据
private void initData() {
homeFragment = new HomeFragment();
investFragment = new InvestFragment();
meFragment = new MeFragment();
moreFragment = new MoreFragment();
}
// 切换Fragment方法
private void switchFragment(Fragment fragment) {
FragmentManager manager = getSupportFragmentManager();
manager.beginTransaction().replace(R.id.fl_main_container, fragment).commit();
}
//再设置RadioGroup的点击事件的监听
private void initLintener() {
rgMain.setOnCheckedChangeListener(new RadioGroup.OnCheckedChangeListener() {
@Override
public void onCheckedChanged(RadioGroup radioGroup, int i) {
Fragment fragment = null;
switch (i) {
case R.id.rb_main_home:
fragment = homeFragment;
break;
case R.id.rb_main_invest:
fragment = investFragment;
break;
case R.id.rb_main_me:
fragment = meFragment;
break;
case R.id.rb_main_more:
fragment = moreFragment;
break;
}
// 切换Fragment方法
switchFragment(fragment);
}
});
// 默认选择会话页面
rgMain.check(R.id.rb_main_home);
}
}
这样简单的页面框架就搭好了!是不是so easy~