Android主界面实现方式
来源:互联网 发布:校园网禁止共享网络 编辑:程序博客网 时间:2024/05/24 06:58
做个笔记,有错误的地方请指点!
有两种类型主界面页的切换:
第一种是FragmentTransaction和Fragment;
第二种是ViewPager和FragmentPagerAdapter;
效果差不多,都可以点击切换,但第二种可以左右滑动切换,
第一种FragmentTransaction和Fragment实现:
效果图:
act_tab1.xml
<?xml version="1.0" encoding="utf-8"?><LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent" android:background="#abcabc" android:orientation="vertical"> <FrameLayout android:id="@+id/container" android:layout_width="match_parent" android:layout_height="match_parent" android:layout_weight="1"> </FrameLayout> <LinearLayout android:id="@+id/bottomPanel" android:layout_width="match_parent" android:layout_height="48dp" android:background="#FFFFFF" android:orientation="horizontal"> <LinearLayout android:id="@+id/ll_home" android:layout_width="0dp" android:layout_height="match_parent" android:layout_weight="1" android:gravity="center" android:orientation="vertical"> <ImageView android:id="@+id/iv_home" android:layout_width="26dp" android:layout_height="26dp" android:src="@drawable/home_selected" /> <TextView android:id="@+id/tv_home" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_marginTop="2dp" android:gravity="center" android:text="首页" android:textColor="#ff7700" /> </LinearLayout> <LinearLayout android:id="@+id/ll_live" android:layout_width="0dp" android:layout_height="match_parent" android:layout_weight="1" android:gravity="center" android:orientation="vertical"> <ImageView android:id="@+id/iv_live" android:layout_width="26dp" android:layout_height="26dp" android:src="@drawable/live_selector" /> <TextView android:id="@+id/tv_live" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_marginTop="2dp" android:gravity="center" android:text="直播" android:textColor="#aaaaaa" /> </LinearLayout> <LinearLayout android:id="@+id/ll_follow" android:layout_width="0dp" android:layout_height="match_parent" android:layout_weight="1" android:gravity="center" android:orientation="vertical"> <ImageView android:id="@+id/iv_follow" android:layout_width="26dp" android:layout_height="26dp" android:src="@drawable/follow_selector" /> <TextView android:id="@+id/tv_follow" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_marginTop="2dp" android:gravity="center" android:text="关注" android:textColor="#aaaaaa" /> </LinearLayout> <LinearLayout android:id="@+id/ll_discover" android:layout_width="0dp" android:layout_height="match_parent" android:layout_weight="1" android:gravity="center" android:orientation="vertical"> <ImageView android:id="@+id/iv_discover" android:layout_width="26dp" android:layout_height="26dp" android:src="@drawable/discover_selector" /> <TextView android:id="@+id/tv_discover" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_marginTop="2dp" android:gravity="center" android:text="发现" android:textColor="#aaaaaa" /> </LinearLayout> <LinearLayout android:id="@+id/ll_user" android:layout_width="0dp" android:layout_height="match_parent" android:layout_weight="1" android:gravity="center" android:orientation="vertical"> <ImageView android:id="@+id/iv_user" android:layout_width="26dp" android:layout_height="26dp" android:src="@drawable/user_selector" /> <TextView android:id="@+id/tv_user" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_marginTop="2dp" android:gravity="center" android:text="我的" android:textColor="#aaaaaa" /> </LinearLayout> </LinearLayout></LinearLayout>
Act_tab1.java文件代码
package com.rrt.tabs;import android.graphics.Color;import android.os.Bundle;import android.support.v4.app.FragmentActivity;import android.support.v4.app.FragmentManager;import android.support.v4.app.FragmentTransaction;import android.view.View;import android.view.Window;import android.widget.ImageView;import android.widget.LinearLayout;import android.widget.TextView;/** * Created by LI on 2017/2/10. */public class Act_tab1 extends FragmentActivity implements View.OnClickListener{ private LinearLayout mLlHome, mLlLive, mLlFollow, mLlDiscover, mLlUser; private ImageView mIvHome, mIvLive, mIvFollow, mIvDiscover, mIvUser; private TextView mTvHome, mTvLive, mTvFollow, mTvDiscover, mTvUser; private FragmentManager mFragmentManager; private HomeFragment mHomeFragment; private LiveFragment mLiveFragment; private FollowFragment mFollowFragment; private DiscoverFragment mDiscoverFragment; private UserFragment mUserFragment; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); requestWindowFeature(Window.FEATURE_NO_TITLE); setContentView(R.layout.act_tab1); initView(); initEvent(); } public void initView() { mLlHome = (LinearLayout) findViewById(R.id.ll_home); mLlLive = (LinearLayout) findViewById(R.id.ll_live); mLlFollow = (LinearLayout) findViewById(R.id.ll_follow); mLlDiscover = (LinearLayout) findViewById(R.id.ll_discover); mLlUser = (LinearLayout) findViewById(R.id.ll_user); mIvHome = (ImageView) findViewById(R.id.iv_home); mIvLive = (ImageView) findViewById(R.id.iv_live); mIvFollow = (ImageView) findViewById(R.id.iv_follow); mIvDiscover = (ImageView) findViewById(R.id.iv_discover); mIvUser = (ImageView) findViewById(R.id.iv_user); mTvHome = (TextView) findViewById(R.id.tv_home); mTvLive = (TextView) findViewById(R.id.tv_live); mTvFollow = (TextView) findViewById(R.id.tv_follow); mTvDiscover = (TextView) findViewById(R.id.tv_discover); mTvUser = (TextView) findViewById(R.id.tv_user); } public void initEvent() { mLlHome.setOnClickListener(this); mLlLive.setOnClickListener(this); mLlFollow.setOnClickListener(this); mLlDiscover.setOnClickListener(this); mLlUser.setOnClickListener(this); /**使用v4包用getSupportFragmentManager,3.0版本后android支持Fragment,用getFragmentManager获取*/ mFragmentManager = getSupportFragmentManager(); setContentTab(0); } @Override public void onClick(View view) { switch (view.getId()) { case R.id.ll_home: chooseBottomView(0); setContentTab(0); break; case R.id.ll_live: chooseBottomView(1); setContentTab(1); break; case R.id.ll_follow: chooseBottomView(2); setContentTab(2); break; case R.id.ll_discover: chooseBottomView(3); setContentTab(3); break; case R.id.ll_user: chooseBottomView(4); setContentTab(4); break; } } public void setContentTab(int position) { FragmentTransaction ft = mFragmentManager.beginTransaction(); hideAllTab(ft); switch (position) { case 0: if (mHomeFragment == null) { mHomeFragment = new HomeFragment(); ft.add(R.id.container, mHomeFragment); } else { ft.show(mHomeFragment); } break; case 1: if (mLiveFragment == null) { mLiveFragment = new LiveFragment(); ft.add(R.id.container, mLiveFragment); } else { ft.show(mLiveFragment); } break; case 2: if (mFollowFragment == null) { mFollowFragment = new FollowFragment(); ft.add(R.id.container, mFollowFragment); } else { ft.show(mFollowFragment); } break; case 3: if (mDiscoverFragment == null) { mDiscoverFragment = new DiscoverFragment(); ft.add(R.id.container, mDiscoverFragment); } else { ft.show(mDiscoverFragment); } break; case 4: if (mUserFragment == null) { mUserFragment = new UserFragment(); ft.add(R.id.container, mUserFragment); } else { ft.show(mUserFragment); } break; } ft.commit(); } public void hideAllTab(FragmentTransaction tf) { if (mHomeFragment != null) { tf.hide(mHomeFragment); } if (mLiveFragment != null) { tf.hide(mLiveFragment); } if (mFollowFragment != null) { tf.hide(mFollowFragment); } if (mDiscoverFragment != null) { tf.hide(mDiscoverFragment); } if (mUserFragment != null) { tf.hide(mUserFragment); } } public void resetBottomView() { mIvHome.setImageResource(R.drawable.home_selector); mIvLive.setImageResource(R.drawable.live_selector); mIvFollow.setImageResource(R.drawable.follow_selector); mIvDiscover.setImageResource(R.drawable.discover_selector); mIvUser.setImageResource(R.drawable.user_selector); mTvHome.setTextColor(Color.parseColor("#aaaaaa")); mTvLive.setTextColor(Color.parseColor("#aaaaaa")); mTvFollow.setTextColor(Color.parseColor("#aaaaaa")); mTvDiscover.setTextColor(Color.parseColor("#aaaaaa")); mTvUser.setTextColor(Color.parseColor("#aaaaaa")); } public void chooseBottomView(int position) { resetBottomView(); switch (position) { case 0: mIvHome.setImageResource(R.drawable.home_selected); mTvHome.setTextColor(Color.parseColor("#FF7700")); break; case 1: mIvLive.setImageResource(R.drawable.live_selected); mTvLive.setTextColor(Color.parseColor("#FF7700")); break; case 2: mIvFollow.setImageResource(R.drawable.follow_selected); mTvFollow.setTextColor(Color.parseColor("#FF7700")); break; case 3: mIvDiscover.setImageResource(R.drawable.discover_selected); mTvDiscover.setTextColor(Color.parseColor("#FF7700")); break; case 4: mIvUser.setImageResource(R.drawable.user_selected); mTvUser.setTextColor(Color.parseColor("#FF7700")); break; } }}HomeFragment.javapublic class HomeFragment extends Fragment { @Override public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) { View view = LayoutInflater.from(getActivity()).inflate(R.layout.fragment_home, null); return view; }}第二种ViewPager与FragmentPagerAdapter实现
效果图:
act_tab2.xml和act1_tab1.xml差不多,只不过把FrameLayout组件换成了ViewPager
<?xml version="1.0" encoding="utf-8"?><LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="vertical"> <android.support.v4.view.ViewPager android:id="@+id/viewpage" android:layout_width="match_parent" android:layout_height="match_parent" android:layout_weight="1"> </android.support.v4.view.ViewPager> <LinearLayout android:id="@+id/bottomPanel" android:layout_width="match_parent" android:layout_height="48dp" android:background="#FFFFFF" android:orientation="horizontal"> <LinearLayout android:id="@+id/ll_home" android:layout_width="0dp" android:layout_height="match_parent" android:layout_weight="1" android:gravity="center" android:orientation="vertical"> <ImageView android:id="@+id/iv_home" android:layout_width="26dp" android:layout_height="26dp" android:src="@drawable/home_selected" /> <TextView android:id="@+id/tv_home" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_marginTop="2dp" android:gravity="center" android:text="首页" android:textColor="#ff7700" /> </LinearLayout> <LinearLayout android:id="@+id/ll_live" android:layout_width="0dp" android:layout_height="match_parent" android:layout_weight="1" android:gravity="center" android:orientation="vertical"> <ImageView android:id="@+id/iv_live" android:layout_width="26dp" android:layout_height="26dp" android:src="@drawable/live_selector" /> <TextView android:id="@+id/tv_live" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_marginTop="2dp" android:gravity="center" android:text="直播" android:textColor="#aaaaaa" /> </LinearLayout> <LinearLayout android:id="@+id/ll_follow" android:layout_width="0dp" android:layout_height="match_parent" android:layout_weight="1" android:gravity="center" android:orientation="vertical"> <ImageView android:id="@+id/iv_follow" android:layout_width="26dp" android:layout_height="26dp" android:src="@drawable/follow_selector" /> <TextView android:id="@+id/tv_follow" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_marginTop="2dp" android:gravity="center" android:text="关注" android:textColor="#aaaaaa" /> </LinearLayout> <LinearLayout android:id="@+id/ll_discover" android:layout_width="0dp" android:layout_height="match_parent" android:layout_weight="1" android:gravity="center" android:orientation="vertical"> <ImageView android:id="@+id/iv_discover" android:layout_width="26dp" android:layout_height="26dp" android:src="@drawable/discover_selector" /> <TextView android:id="@+id/tv_discover" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_marginTop="2dp" android:gravity="center" android:text="发现" android:textColor="#aaaaaa" /> </LinearLayout> <LinearLayout android:id="@+id/ll_user" android:layout_width="0dp" android:layout_height="match_parent" android:layout_weight="1" android:gravity="center" android:orientation="vertical"> <ImageView android:id="@+id/iv_user" android:layout_width="26dp" android:layout_height="26dp" android:src="@drawable/user_selector" /> <TextView android:id="@+id/tv_user" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_marginTop="2dp" android:gravity="center" android:text="我的" android:textColor="#aaaaaa" /> </LinearLayout> </LinearLayout></LinearLayout>Act_tab2.java代码package com.rrt.tabs;import android.app.Activity;import android.graphics.Color;import android.os.Bundle;import android.support.v4.app.Fragment;import android.support.v4.app.FragmentActivity;import android.support.v4.app.FragmentPagerAdapter;import android.support.v4.view.ViewPager;import android.view.View;import android.view.Window;import android.widget.ImageView;import android.widget.LinearLayout;import android.widget.TextView;/** * Created by LI on 2017/2/10. */public class Act_tab2 extends FragmentActivity implements View.OnClickListener{ private LinearLayout mLlHome, mLlLive, mLlFollow, mLlDiscover, mLlUser; private ImageView mIvHome, mIvLive, mIvFollow, mIvDiscover, mIvUser; private TextView mTvHome, mTvLive, mTvFollow, mTvDiscover, mTvUser; private ViewPager mViewPager; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); requestWindowFeature(Window.FEATURE_NO_TITLE); setContentView(R.layout.act_tab2); initView(); initEvent(); } public void initView() { mLlHome = (LinearLayout) findViewById(R.id.ll_home); mLlLive = (LinearLayout) findViewById(R.id.ll_live); mLlFollow = (LinearLayout) findViewById(R.id.ll_follow); mLlDiscover = (LinearLayout) findViewById(R.id.ll_discover); mLlUser = (LinearLayout) findViewById(R.id.ll_user); mIvHome = (ImageView) findViewById(R.id.iv_home); mIvLive = (ImageView) findViewById(R.id.iv_live); mIvFollow = (ImageView) findViewById(R.id.iv_follow); mIvDiscover = (ImageView) findViewById(R.id.iv_discover); mIvUser = (ImageView) findViewById(R.id.iv_user); mTvHome = (TextView) findViewById(R.id.tv_home); mTvLive = (TextView) findViewById(R.id.tv_live); mTvFollow = (TextView) findViewById(R.id.tv_follow); mTvDiscover = (TextView) findViewById(R.id.tv_discover); mTvUser = (TextView) findViewById(R.id.tv_user); mViewPager = (ViewPager) findViewById(R.id.viewpage); } public void initEvent() { mLlHome.setOnClickListener(this); mLlLive.setOnClickListener(this); mLlFollow.setOnClickListener(this); mLlDiscover.setOnClickListener(this); mLlUser.setOnClickListener(this); mViewPager.setAdapter(new FragmentPagerAdapter(getSupportFragmentManager()) { @Override public Fragment getItem(int position) { switch (position) { case 0: return new HomeFragment(); case 1: return new LiveFragment(); case 2: return new FollowFragment(); case 3: return new DiscoverFragment(); case 4: return new UserFragment(); } return null; } @Override public int getCount() { return 5; } @Override public CharSequence getPageTitle(int position) { return "标题" + position; } }); mViewPager.addOnPageChangeListener(new ViewPager.OnPageChangeListener() { @Override public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) { } @Override public void onPageSelected(int position) { chooseBottomView(position); } @Override public void onPageScrollStateChanged(int state) { } }); } @Override public void onClick(View view) { switch (view.getId()) { case R.id.ll_home: mViewPager.setCurrentItem(0, false); chooseBottomView(0); break; case R.id.ll_live: mViewPager.setCurrentItem(1, false); chooseBottomView(1); break; case R.id.ll_follow: mViewPager.setCurrentItem(2, false); chooseBottomView(2); break; case R.id.ll_discover: mViewPager.setCurrentItem(3, false); chooseBottomView(3); break; case R.id.ll_user: mViewPager.setCurrentItem(4, false); chooseBottomView(4); break; } } public void resetBottomView() { mIvHome.setImageResource(R.drawable.home_selector); mIvLive.setImageResource(R.drawable.live_selector); mIvFollow.setImageResource(R.drawable.follow_selector); mIvDiscover.setImageResource(R.drawable.discover_selector); mIvUser.setImageResource(R.drawable.user_selector); mTvHome.setTextColor(Color.parseColor("#aaaaaa")); mTvLive.setTextColor(Color.parseColor("#aaaaaa")); mTvFollow.setTextColor(Color.parseColor("#aaaaaa")); mTvDiscover.setTextColor(Color.parseColor("#aaaaaa")); mTvUser.setTextColor(Color.parseColor("#aaaaaa")); } public void chooseBottomView(int position) { resetBottomView(); switch (position) { case 0: mIvHome.setImageResource(R.drawable.home_selected); mTvHome.setTextColor(Color.parseColor("#FF7700")); break; case 1: mIvLive.setImageResource(R.drawable.live_selected); mTvLive.setTextColor(Color.parseColor("#FF7700")); break; case 2: mIvFollow.setImageResource(R.drawable.follow_selected); mTvFollow.setTextColor(Color.parseColor("#FF7700")); break; case 3: mIvDiscover.setImageResource(R.drawable.discover_selected); mTvDiscover.setTextColor(Color.parseColor("#FF7700")); break; case 4: mIvUser.setImageResource(R.drawable.user_selected); mTvUser.setTextColor(Color.parseColor("#FF7700")); break; } }}0 0
- Android主界面实现方式
- Android聊天界面实现方式
- android-多种方式实现主界面的Tab
- android-多种方式实现主界面的Tab
- 三种实现Android主界面Tab的方式
- 三种实现Android主界面Tab的方式
- google play 主界面实现方式:
- Android主界面Tab的几种实现方式;7.18日学习总结
- Android 开发之——多种方式实现主界面的Tab
- Android界面刷新方式
- android界面无标题栏和全屏效果的实现方式
- android界面无标题栏和全屏效果的实现方式
- android界面无标题栏和全屏效果的实现方式
- android界面无标题栏和全屏效果的实现方式
- Android中界面实现全屏显示的两种方式
- android界面无标题和全屏效果实现方式
- Android界面无标题栏和全屏效果的实现方式
- Android使用Fragment嵌套Fragment的方式实现界面滑动
- echarts使用e_macarons方法
- VisualStudio中的调试命令参数中%的转义问题
- Redis内存分配策略
- IOS 微信获取accesstoken 40029
- 1070.Mooncake (25)
- Android主界面实现方式
- PHP保存base64格式的图片内容为图片文件
- 2.9
- 码云git也是不错的之git使用图文详解
- 读书清单
- 在学习泛型时遇到的困惑经常与func<T,U>混淆
- css基础学习之文字属性
- 20170209dokuwiki安装
- Android中ANR造成的原因以及如何避免