底部radiogroup+fragment页面改变,radiobutton切换变色或换图片

底部是radiogroup里面有4个radiobutton

上面先使用一个布局来占位,当点击radiobutton时候使用事务切换fragment显示


activity_main.xml的布局

<?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.example.day171226_radiofragment.MainActivity">

    <RelativeLayout
        android:id="@+id/ralative"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_above="@+id/radio_group" >
    </RelativeLayout>

    <RadioGroup
        android:id="@+id/radio_group"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
        android:orientation="horizontal" >

        <RadioButton
            android:textSize="20sp"
            android:checked="true"
            android:id="@+id/radio_01"
            android:gravity="center"
            android:padding="10dp"
            android:button="@null"
            android:background="@drawable/radio_selector"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:text="微信" />

        <RadioButton
            android:textSize="20sp"
            style="@style/radioStyle"
            android:id="@+id/radio_02"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:text="通讯录" />

        <RadioButton
            android:textSize="20sp"
            style="@style/radioStyle"
            android:id="@+id/radio_03"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:text="发现" />

        <RadioButton
            android:textSize="20sp"
            style="@style/radioStyle"
            android:id="@+id/radio_04"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:text="我的" />
    </RadioGroup>
</RelativeLayout>
radiobutton的style,在style文件中加入下面的
<resources>

    <!-- Base application theme. -->
    <style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
        <!-- Customize your theme here. -->
        <item name="colorPrimary">@color/colorPrimary</item>
        <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
        <item name="colorAccent">@color/colorAccent</item>
    </style>

    <!-- 自定义的radioButton的style -->
    <style name="radioStyle">
        <item name="android:gravity">center</item>
        <item name="android:padding">10dp</item>
        <item name="android:button">@null</item>
        <item name="android:background">@drawable/radio_selector</item>

    </style>
</resources>
改变radiobutton背景颜色的文件drawable下面New - Drawable Resource File

创建radio_selector.xml根元素为selector

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <!-- 根之前不同的是,要显示的是背景颜色,不在是图片 -->
    <item android:state_checked="true" android:drawable="@color/radio_select"></item>
    <item android:state_checked="false" android:drawable="@color/radio_no"></item>
    <item  android:drawable="@color/radio_no"></item>

</selector>
colors.xml中添加

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <color name="colorPrimary">#3F51B5</color>
    <color name="colorPrimaryDark">#303F9F</color>
    <color name="colorAccent">#FF4081</color>
    
    <!--改变radiobutton的背景颜色-->
    <color name="radio_select">#F38FB3</color>
    <color name="radio_no">#F4BED6</color>
</resources>
创建fragment_01.xml的布局

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:gravity="center"
    android:layout_height="match_parent">

    <TextView
        android:textSize="23sp"
        android:text="微信页面"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" />
</LinearLayout>
创建fragment01的类

public class Fragment01 extends Fragment {

    @Nullable
    @Override
    public View onCreateView(LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) {
       View view = inflater.inflate(R.layout.fragment_01,container,false);
        return view;
    }
}
MainActivity.java里面,使用事务替换fragment显示

public class MainActivity extends AppCompatActivity implements RadioGroup.OnCheckedChangeListener {

    private RadioGroup group;
    private FragmentManager manager;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        group = findViewById(R.id.radio_group);
        //使用事务替换fragment 的布局

        manager = getSupportFragmentManager();

        Fragment01 fragment01 = new Fragment01();
        manager.beginTransaction().replace(R.id.ralative,fragment01).commit();

        group.setOnCheckedChangeListener(this);

    }

    //group的点击事件,切换fragment
    @Override
    public void onCheckedChanged(RadioGroup radioGroup, int i) {
        //拿到事务的对象
        FragmentTransaction transaction = manager.beginTransaction();

        switch (i){
            case R.id.radio_01:
                transaction.replace(R.id.ralative,new Fragment01());
                break;
            case R.id.radio_02:
                transaction.replace(R.id.ralative,new Fragment02());
                break;
            case R.id.radio_03:
                transaction.replace(R.id.ralative,new Fragment03());
                break;
            case R.id.radio_04:
                transaction.replace(R.id.ralative,new Fragment04());
                break;

        }
        //同一个事务 提交
        transaction.commit();
    }
}



--------------------------------------------------------------

另一种底部radiogroup放置的是图片,点击切换按钮的时候背景图片改变


先放上这10张图片

布局里面,上面一个布局占位,下面一组radiogroup

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout 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"
    >

    <RelativeLayout
        android:id="@+id/ralative"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_above="@+id/radio_group">
        
    </RelativeLayout>

    <RadioGroup
        android:id="@+id/radio_group"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
        android:orientation="horizontal">

        <RadioButton
            android:id="@+id/radio_01"
            android:layout_width="0dp"
            android:layout_height="75dp"
            android:layout_weight="1"
            android:background="@drawable/home_selector"
            android:button="@null"
            android:checked="true"
            android:gravity="center"
            android:padding="10dp"
            android:textSize="20sp" />

        <RadioButton
            android:gravity="center"
            android:padding="10dp"
            android:button="@null"
            android:id="@+id/radio_02"
            android:layout_width="0dp"
            android:layout_height="75dp"
            android:layout_weight="1"
            android:background="@drawable/catagory_selector"
            android:textSize="20sp" />

        <RadioButton
            android:gravity="center"
            android:padding="10dp"
            android:button="@null"
            android:id="@+id/radio_03"
            android:layout_width="0dp"
            android:layout_height="75dp"
            android:layout_weight="1"
            android:background="@drawable/faxian_selector"
            android:textSize="20sp" />

        <RadioButton
            android:gravity="center"
            android:padding="10dp"
            android:button="@null"
            android:id="@+id/radio_04"
            android:layout_width="0dp"
            android:layout_height="75dp"
            android:layout_weight="1"
            android:background="@drawable/cart_selector"
            android:textSize="20sp" />

        <RadioButton
            android:gravity="center"
            android:padding="10dp"
            android:button="@null"
            android:id="@+id/radio_05"
            android:layout_width="0dp"
            android:layout_height="75dp"
            android:layout_weight="1"
            android:background="@drawable/mine_selector"
            android:textSize="20sp" />
    </RadioGroup>
</RelativeLayout>

radiobutton的背景图片的文件 ,在drawable下面New-Drawable Resource File


五张图片,需要五个文件,这里以home_selector.xml(首页的背景图标))为例,其他举一反三

home_selector.xml

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">

    <item android:state_checked="true" android:drawable="@drawable/ac1"/>
    <item android:state_checked="false" android:drawable="@drawable/ac0"/>
</selector>

Activity中,使用事务进行控制fragment的切换

public class SecondActivity extends AppCompatActivity implements RadioGroup.OnCheckedChangeListener {

    private RadioGroup group;
    private FragmentManager manager;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_second);

        group = (RadioGroup) findViewById(R.id.radio_group);
        //使用事务切换布局
        manager = getSupportFragmentManager();
        Shouye_Fragment shouye_fragment = new Shouye_Fragment();
        //进入页面默认显示首页fragment
        manager.beginTransaction().replace(R.id.ralative,shouye_fragment).commit();
        group.setOnCheckedChangeListener(this);

    }
    
    //radiogroup的点击事件
    @Override
    public void onCheckedChanged(RadioGroup radioGroup, int i) {

        //拿到事务的对象
        FragmentTransaction transaction = manager.beginTransaction();
        switch (i){
            case R.id.radio_01:
                transaction.replace(R.id.ralative,new Shouye_Fragment());
                break;
            case R.id.radio_02:
                transaction.replace(R.id.ralative,new Fenlei_Fragment());
                break;
            case R.id.radio_03:
                transaction.replace(R.id.ralative,new Faxian_Fragment());
                break;
            case R.id.radio_04:
                transaction.replace(R.id.ralative,new GouWuChe_Fragment());
                break;
            case R.id.radio_05:
                transaction.replace(R.id.ralative,new WoDe_Fragment());
                break;
        }
        //提交 事务
        transaction.commit();
    }

}




发布了110 篇原创文章 · 获赞 32 · 访问量 7万+
展开阅读全文

动态的使用Fragment底部四个按钮的布局怎么写

01-25

原文链接http://blog.csdn.net/lmj623565791/article/details/37970961 我是这样写的但是选中底部的按钮后无效果 <?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:baselineAligned="false" android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="horizontal" > <LinearLayout android:layout_width="0dp" android:layout_height="wrap_content" android:layout_weight="1" android:id="@+id/tab_bottom_weixin" > <Button android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="@string/button1" android:onClick="onClick" > </Button> </LinearLayout> <LinearLayout android:layout_width="0dp" android:layout_height="wrap_content" android:layout_weight="1" android:id="@+id/tab_bottom_friend"> <Button android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="@string/button2" android:onClick="onClick"> </Button> </LinearLayout> <LinearLayout android:layout_width="0dp" android:layout_height="wrap_content" android:layout_weight="1" > <Button android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="@string/button3"> </Button> </LinearLayout> <LinearLayout android:layout_width="0dp" android:layout_height="wrap_content" android:layout_weight="1" > <Button android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="@string/button4"> </Button> </LinearLayout> <android.support.v4.view.ViewPager android:id="@+id/vPager" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_gravity="center" android:layout_weight="1.0" android:background="#000000" android:flipInterval="30" android:persistentDrawingCache="animation" /> </LinearLayout> 问答

没有更多推荐了,返回首页

©️2019 CSDN 皮肤主题: 编程工作室 设计师: CSDN官方博客

分享到微信朋友圈

×

扫一扫,手机浏览