Fragment+RadioButton实现点击切换页面效果
2024-05-10 17:34:42
首先我们需要在主布局文件中 放一个 容器，方便让fragment加入进去,我们创建了四个Fragment，并用RedioButton实现了导航栏
MainActivity.java
1 package com.example.administrator.fragmentdemo;
2
3 import android.app.Activity;
4 import android.app.FragmentManager;
5 import android.app.FragmentTransaction;
6 import android.os.Bundle;
7 import android.view.View;
8 import android.widget.RadioButton;
9
10
11 public class MainActivity extends Activity implements View.OnClickListener {
12
13 private RadioButton image1;
14 private RadioButton image2;
15 private RadioButton image3;
16 private RadioButton image4;
17
18 private FirstFragment firstFragment;
19 private SecondFragment secondFragment;
20 private ThirdFragment thirdFragment;
21 private FourFragment fourFragment;
22
23 @Override
24 protected void onCreate(Bundle savedInstanceState) {
25 super.onCreate(savedInstanceState);
26 setContentView(R.layout.activity_main);
27
28 initViews();
29 initEvents();
30 //首先 我们先选定一个
31 select(0);
32 }
33 //初始化 各种个 View
34 private void initViews(){
35 image1 = (RadioButton) findViewById(R.id.tab_image1);
36 image2 = (RadioButton) findViewById(R.id.tab_image2);
37 image3 = (RadioButton) findViewById(R.id.tab_image3);
38 image4 = (RadioButton) findViewById(R.id.tab_image4);
39 }
40 //初始化 监听事件
41 private void initEvents(){
42 image1.setOnClickListener(this);
43 image2.setOnClickListener(this);
44 image3.setOnClickListener(this);
45 image4.setOnClickListener(this);
46 }
47 // 初始化 各种图片
48 private void initImageBack(){
49 image1.setBackgroundResource(R.drawable.chatting_biaoqing_btn_normal);
50 image2.setBackgroundResource(R.drawable.lbs_icon_disable);
51 image3.setBackgroundResource(R.drawable.scan_book);
52 image4.setBackgroundResource(R.drawable.scan_word);
53 }
54 //
55 private void select(int i){
56 FragmentManager fm = getFragmentManager(); //获得Fragment管理器
57 FragmentTransaction ft = fm.beginTransaction(); //开启一个事务
58
59 hidtFragment(ft); //先隐藏 Fragment
60
61 switch (i){
62 case 0:
63 image1.setBackgroundResource(R.drawable.chatting_biaoqing_btn_enable);
64 if (firstFragment == null){
65 firstFragment = new FirstFragment();
66 ft.add(R.id.fragment_container,firstFragment);
67 }else{
68 ft.show(firstFragment);
69 }
70 break;
71 case 1:
72 image2.setBackgroundResource(R.drawable.lbs_icon_enable);
73 if (secondFragment == null){
74 secondFragment = new SecondFragment();
75 ft.add(R.id.fragment_container,secondFragment);
76 }else {
77 ft.show(secondFragment);
78 }
79 break;
80 case 2:
81 image3.setBackgroundResource(R.drawable.scan_book_hl);
82 if (thirdFragment == null){
83 thirdFragment = new ThirdFragment();
84 ft.add(R.id.fragment_container,thirdFragment);
85 }else {
86 ft.show(thirdFragment);
87 }
88 break;
89 case 3:
90 image4.setBackgroundResource(R.drawable.scan_word_hl);
91 if(fourFragment == null){
92 fourFragment = new FourFragment();
93 ft.add(R.id.fragment_container,fourFragment);
94 }else {
95 ft.show(fourFragment);
96 }
97 break;
98 }
99 ft.commit(); //提交事务
100 }
101 //隐藏所有Fragment
102 private void hidtFragment(FragmentTransaction fragmentTransaction){
103 if (firstFragment != null){
104 fragmentTransaction.hide(firstFragment);
105 }
106 if (secondFragment != null){
107 fragmentTransaction.hide(secondFragment);
108 }
109 if (thirdFragment != null){
110 fragmentTransaction.hide(thirdFragment);
111 }
112 if (fourFragment != null){
113 fragmentTransaction.hide(fourFragment);
114 }
115 }
116 //重写监听
117 @Override
118 public void onClick(View v) {
119
120 initImageBack(); //初始化 图片背景
121
122 switch (v.getId()){
123 case R.id.tab_image1:
124 select(0);
125 break;
126 case R.id.tab_image2:
127 select(1);
128 break;
129 case R.id.tab_image3:
130 select(2);
131 break;
132 case R.id.tab_image4:
133 select(3);
134 break;
135 }
136 }
137 }
主布局文件,在这里我分开写的，底部的导航栏有新建了一个xml文件，并在主布局文件中用include将他包含进来。
activity_main.xml
<LinearLayoutxmlns: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=".MainActivity"><ImageViewandroid:layout_width="match_parent"android:layout_height="40dp"android:background="@drawable/friendactivity_comment_frame_pressed"/><FrameLayoutandroid:id="@+id/fragment_container"android:layout_width="match_parent"android:layout_height="0dp"android:layout_weight="1"></FrameLayout><include layout="@layout/activity_main_tab_view"/></LinearLayout>
底部导航栏的布局文件
<?xml version="1.0" encoding="utf-8"?> <LinearLayoutxmlns:android="http://schemas.android.com/apk/res/android"android:orientation="horizontal"android:layout_width="match_parent"android:layout_height="50dp"android:layout_gravity="bottom"android:background="@drawable/friendactivity_comment_frame_pressed"><RadioGroupandroid:layout_width="match_parent"android:layout_height="match_parent"android:orientation="horizontal"><RadioButtonandroid:id="@+id/tab_image1"android:layout_width="0dp"android:layout_height="match_parent"android:layout_weight="1"android:button="@null"android:background="@drawable/chatting_biaoqing_btn_normal"/><RadioButtonandroid:id="@+id/tab_image2"android:layout_width="0dp"android:layout_height="match_parent"android:layout_weight="1"android:button="@null"android:background="@drawable/lbs_icon_disable"/><RadioButtonandroid:id="@+id/tab_image3"android:layout_width="0dp"android:layout_height="match_parent"android:layout_weight="1"android:button="@null"android:background="@drawable/scan_book"/><RadioButtonandroid:id="@+id/tab_image4"android:layout_width="0dp"android:layout_height="match_parent"android:layout_weight="1"android:button="@null"android:background="@drawable/scan_word"/></RadioGroup></LinearLayout>
四个fragment都一样，我就放一个代码，布局也很简单，就放了一个TextView
Fragment.java
package com.example.administrator.fragmentdemo;import android.app.Fragment;
import android.os.Bundle;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;/*** Created by Administrator on 2015/9/3.*/
public class FirstFragment extends Fragment {@Overridepublic View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {return inflater.inflate(R.layout.first_fragment_view,container,false);}
}
该fragment的布局文件为:
<?xml version="1.0" encoding="utf-8"?> <LinearLayoutxmlns:android="http://schemas.android.com/apk/res/android"android:layout_width="match_parent"android:layout_height="match_parent"android:orientation="vertical"><TextViewandroid:layout_width="wrap_content"android:layout_height="wrap_content"android:text="This is frist fragment"/> </LinearLayout>
Fragment+RadioButton实现点击切换页面效果相关推荐
- angular点击按钮弹出页面_Axure RP8：如何做出点击按钮切换页面效果？
如何利用Axure RP8做出点击按钮切换页面效果?一起来文中看看~ 先来看一下页面的效果图:点击不同的按钮,切换不同的页面.(是web端和手机端都很常见的交互效果) 实现这一效果大致要分为三个步骤: ...
- html怎么做到滚动鼠标转换,js实现的鼠标滚轮滚动切换页面效果(类似360默认页面滚动切换效果)...
本文实例讲述了js实现的鼠标滚轮滚动切换页面效果的方法.分享给大家供大家参考,具体如下: 运行效果截图如下: 具体代码如下: wheel var currentShowPageIndex = 0; v ...
- fragment+viewpager+tablayou实现滑动切换页面
本文目标:实现滑动切换页面 首先,Tablayout控件就需要添加design library,在android studio中添加依赖 compile 'com.android.support:d ...
- vue制作点击切换图片效果
思路 创建一个数组,数组里面放入图片,利用props(父组件向子组件传值),v-for(循环),v-bind(绑定属性)将图片传入HTML定义的div中. Ⅰ.在头部导入vue文件(导入前提是vue文 ...
- 使用css3和h5实现幻灯片，点击切换图片效果
css3代码部分 <style>*{padding: 0;margin: 0;}.box{display: block;width: 300px;height: 70px;}ul{disp ...
- java点击按钮隐藏图片6_原生JS实现隐藏显示图片 JS实现点击切换图片效果
今天要说的内容,看标题就都能知道了!所有知识点一览无遗啊!咱们今天的东西,是纯纯的原生JS代码, 我先说一下要求: 1.有两个按钮,内容为显示,和换, 2.当点击显示的时候,按钮文字变成隐藏,同时图片 ...
- 如何使用JQ封装轮播图 实现自动轮播、点击切换等效果..
css部分: *{margin: 0;padding: 0;}#banner{width: 800px;height: 500px;margin: 30px auto;position: relati ...
- 前端js控制点击切换效果且刷新浏览器不会重置
提示:文章写完后,目录可以自动生成,如何生成可参考右边的帮助文档 文章目录 前言 一.布局的部分代码和样式 二.使用js来控制点击时颜色变化,点击哪一个图标,哪一个图标就应该变橙色且带有下边框 1.分 ...
- Vue实现底部导航栏切换页面及图片
前言 刚进新公司,有幸接触到从前后端不分离到前后端分离的一个过程,最开始对vue不太熟悉,下班自学一周就开始做了,可能会有很多问题,若有写不好的地方大佬们可以提出. 一.实现效果 需求:vue底部导航 ...
最新文章
- Git入门教程（上）
- .net thread操作串口_听说你不知道 RT-Thread 有个 ringbuffer
- Python执行pyinstaller打包生成的exe文件实战
- aspose word copy 获取某页的内容_6月已至，Aspose.Words又双叒叕更新到v20.6！PDF版本1.5标记过时...
- java（十六） 对象的this引用
- 【OpenCV3】cv::Mat中的数据按行列写入txt文件中
- easyexcel根据模板写入_ProxmoxVE 之 创建win10基础镜像模板
- python k线顶分型_【缠论】分型、笔的定义及其程序化
- 判断用户输入的银行卡号是否正确--基于Luhn算法的格式校验
- 简单选择排序及其优化
- oracle最难的多表查询,Oracle多表的复杂查询
- C# 视频监控系列（12）：H264播放器——播放录像文件
- 大华ITC215WEB相机常用功能设置说明
- 你不知道的网络招聘与求职潜规则
- 我想健康富有聪明怎么导告_想要成为一个快乐而富有成效的程序员吗？ 使用心理学的这5种技巧...
- c盘满了怎么清理垃圾而不误删？教你瞬间多出20个G
- 舞蹈链算法与数独求解
- QQ被盗，连声音都盗走了
- hazy的面试小笔记之Spring(持续更新)
- c语言 整数拆分,C++ 整数拆分方法详解