刚开始写博客，很多地方很粗糙，希望大家见谅，不过有什么好的建议可以给我留言。今天和大家分享的是可以点击但是不能滑动的底部菜单栏，因最近做的项目是要实现这样的效果，之后有时间会继续发表ViewPager可以滑动也可以点击的。
废话不多说，直接给大家看效果图，及实现代码。本来想贴一个动态点击的效果图，搞了半天不知道怎么添加，所以先贴几张图片吧。
效果图：
效果图就是这样，这里我写了5个项，点击每一个会变色，并且会改变图片，这里的图片我就不提供了，大家根据需要换成自己的就可以了。
首先，看一下xml中的代码：
<?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" tools:context="com.example.administrator.tangkedoctor.MainActivity"> <LinearLayout android:id="@+id/ll_tabs" android:layout_width="match_parent" android:layout_height="wrap_content" android:background="@drawable/shape_rect_dibu" android:gravity="center" android:orientation="horizontal" android:clickable="true" android:layout_alignParentBottom="true" > <LinearLayout android:layout_width="0dp" android:layout_height="wrap_content" android:layout_gravity="center" android:orientation="vertical" android:onClick="onClick" android:id="@+id/btn_one" android:layout_weight="1"> <TextView android:layout_width="30dp" android:layout_height="30dp" android:layout_gravity="center" android:id="@+id/shopping1" android:layout_weight="1" android:background="@mipmap/m4" android:textColor="#474747" /> <TextView android:layout_marginBottom="4dp" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_gravity="center" android:text="Tab1" android:textSize="10dp" android:id="@+id/shopping2" android:layout_weight="1"/> </LinearLayout> <LinearLayout android:layout_width="0dp" android:layout_height="wrap_content" android:onClick="onClick" android:id="@+id/btn_two" android:clickable="true" android:orientation="vertical" android:layout_weight="1"> <TextView android:layout_width="30dp" android:layout_height="30dp" android:layout_gravity="center" android:layout_weight="1" android:id="@+id/community1" android:background="@mipmap/m3" /> <TextView android:layout_marginBottom="4dp" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_gravity="center" android:text="Tab2" android:id="@+id/community2" android:textSize="10dp" android:layout_weight="1"/> </LinearLayout> <LinearLayout android:layout_width="0dp" android:layout_height="wrap_content" android:orientation="vertical" android:id="@+id/btn_three" android:onClick="onClick" android:clickable="true" android:layout_weight="1"> <TextView android:layout_width="30dp" android:layout_height="30dp" android:layout_gravity="center" android:layout_weight="1" android:id="@+id/homepage1" android:background="@mipmap/color1" /> <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_gravity="center" android:text="Tab3" android:textColor="#00c168" android:textSize="10dp" android:layout_weight="1" android:id="@+id/homepage2"/> </LinearLayout> <LinearLayout android:layout_width="0dp" android:layout_height="wrap_content" android:orientation="vertical" android:id="@+id/btn_four" android:onClick="onClick" android:clickable="true" android:layout_weight="1"> <TextView android:layout_width="30dp" android:layout_height="30dp" android:layout_gravity="center" android:layout_weight="1" android:id="@+id/communcation1" android:background="@mipmap/m2" /> <TextView android:layout_marginBottom="4dp" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_gravity="center" android:text="Tab4" android:textSize="10dp" android:layout_weight="1" android:id="@+id/communcation2"/> </LinearLayout> <LinearLayout android:layout_width="0dp" android:layout_height="wrap_content" android:orientation="vertical" android:id="@+id/btn_five" android:onClick="onClick" android:clickable="true" android:layout_weight="1"> <TextView android:layout_width="30dp" android:layout_height="30dp" android:layout_gravity="center" android:layout_weight="1" android:id="@+id/person1" android:background="@mipmap/m5" /> <!-- android:textColor="@android:color/holo_blue_dark"--> <TextView android:layout_marginBottom="4dp" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_gravity="center" android:text="Tab5" android:textSize="10dp" android:layout_weight="1" android:id="@+id/person2"/> </LinearLayout> </LinearLayout> <RelativeLayout android:layout_above="@+id/ll_tabs" android:id="@+id/mianRL" android:layout_width="match_parent" android:layout_height="match_parent" ></RelativeLayout> </RelativeLayout>其中自己写的一个shape：
<?xml version="1.0" encoding="utf-8"?> <shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle" > <!--用于底部的，白背景，灰框--> <solid android:color="#ffffff"/> <padding android:left="1dp" android:right="1dp" android:top="2dp"/> <stroke android:color="#cfd1d1" android:width="2px" /> </shape>
MainActivity中代码：
package com.example.tab; import android.os.Bundle; import android.support.v4.app.Fragment; import android.support.v4.app.FragmentTransaction; import android.support.v7.app.AppCompatActivity; import android.view.View; import android.widget.LinearLayout; import android.widget.RelativeLayout; import android.widget.TextView; public class MainActivity extends AppCompatActivity implements View.OnClickListener { RelativeLayout mianRL; LinearLayout btn_one, btn_two, btn_three, btn_four, btn_five; HomepageFragment homepageFragment; CommuncationFragment communcationFragment; CommunityFragment communityFragment; PersonFragment personFragment; ShoppingFragment shoppingFragment; TextView textView1, textView11, textView2, textView22, textView3, textView33, textView4, textView44, textView5, textView55; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); mianRL = (RelativeLayout) findViewById(R.id.mianRL); //初始化信息 init(); } public void init() { // 改变图片的描述信息 textView1 = (TextView) findViewById(R.id.shopping1); textView11 = (TextView) findViewById(R.id.shopping2); textView2 = (TextView) findViewById(R.id.community1); textView22 = (TextView) findViewById(R.id.community2); textView3 = (TextView) findViewById(R.id.homepage1); textView33 = (TextView) findViewById(R.id.homepage2); textView4 = (TextView) findViewById(R.id.communcation1); textView44 = (TextView) findViewById(R.id.communcation2); textView5 = (TextView) findViewById(R.id.person1); textView55 = (TextView) findViewById(R.id.person2); btn_one = (LinearLayout) findViewById(R.id.btn_one); btn_two = (LinearLayout) findViewById(R.id.btn_two); btn_three = (LinearLayout) findViewById(R.id.btn_three); btn_four = (LinearLayout) findViewById(R.id.btn_four); btn_five = (LinearLayout) findViewById(R.id.btn_five); btn_one.setOnClickListener(this); btn_two.setOnClickListener(this); btn_three.setOnClickListener(this); btn_four.setOnClickListener(this); btn_five.setOnClickListener(this); homepageFragment = new HomepageFragment(); addFragment(homepageFragment); showFragment(homepageFragment); } @Override public void onClick(View v) { switch (v.getId()) { case R.id.btn_one: if (shoppingFragment == null) { shoppingFragment = new ShoppingFragment(); addFragment(shoppingFragment); showFragment(shoppingFragment); } else { showFragment(shoppingFragment); } textView1.setBackgroundResource(R.mipmap.color4); textView11.setTextColor(0xff00c168); textView2.setBackgroundResource(R.mipmap.m3); textView22.setTextColor(0xff474747); textView3.setBackgroundResource(R.mipmap.m1); textView33.setTextColor(0xff474747); textView4.setBackgroundResource(R.mipmap.m2); textView44.setTextColor(0xff474747); textView5.setBackgroundResource(R.mipmap.m5); textView55.setTextColor(0xff474747); break; case R.id.btn_two: if (communityFragment == null) { communityFragment = new CommunityFragment(); addFragment(communityFragment); showFragment(communityFragment); } else { showFragment(communityFragment); } textView1.setBackgroundResource(R.mipmap.m4); textView11.setTextColor(0xff474747); textView2.setBackgroundResource(R.mipmap.color3); textView22.setTextColor(0xff00c168); textView3.setBackgroundResource(R.mipmap.m1); textView33.setTextColor(0xff474747); textView4.setBackgroundResource(R.mipmap.m2); textView44.setTextColor(0xff474747); textView5.setBackgroundResource(R.mipmap.m5); textView55.setTextColor(0xff474747); break; case R.id.btn_three: if (homepageFragment == null) { homepageFragment = new HomepageFragment(); addFragment(homepageFragment); showFragment(homepageFragment); } else { showFragment(homepageFragment); } textView1.setBackgroundResource(R.mipmap.m4); textView11.setTextColor(0xff474747); textView2.setBackgroundResource(R.mipmap.m3); textView22.setTextColor(0xff474747); textView3.setBackgroundResource(R.mipmap.color1); textView33.setTextColor(0xff00c168); textView4.setBackgroundResource(R.mipmap.m2); textView44.setTextColor(0xff474747); textView5.setBackgroundResource(R.mipmap.m5); textView55.setTextColor(0xff474747); break; case R.id.btn_four: if (communcationFragment == null) { communcationFragment = new CommuncationFragment(); addFragment(communcationFragment); showFragment(communcationFragment); } else { showFragment(communcationFragment); } textView1.setBackgroundResource(R.mipmap.m4); textView11.setTextColor(0xff474747); textView2.setBackgroundResource(R.mipmap.m3); textView22.setTextColor(0xff474747); textView3.setBackgroundResource(R.mipmap.m1); textView33.setTextColor(0xff474747); textView4.setBackgroundResource(R.mipmap.color2); textView44.setTextColor(0xff00c168); textView5.setBackgroundResource(R.mipmap.m5); textView55.setTextColor(0xff474747); break; case R.id.btn_five: if (personFragment == null) { personFragment = new PersonFragment(); addFragment(personFragment); showFragment(personFragment); } else { showFragment(personFragment); } textView1.setBackgroundResource(R.mipmap.m4); textView11.setTextColor(0xff474747); textView2.setBackgroundResource(R.mipmap.m3); textView22.setTextColor(0xff474747); textView3.setBackgroundResource(R.mipmap.m1); textView33.setTextColor(0xff474747); textView4.setBackgroundResource(R.mipmap.m2); textView44.setTextColor(0xff474747); textView5.setBackgroundResource(R.mipmap.color5); textView55.setTextColor(0xff00c168); break; default: break; } } @Override protected void onDestroy() { super.onDestroy(); } /** * 添加Fragment **/ public void addFragment(Fragment fragment) { FragmentTransaction ft = this.getSupportFragmentManager().beginTransaction(); ft.add(R.id.mianRL, fragment); ft.commitAllowingStateLoss(); } /** * 删除Fragment **/ public void removeFragment(Fragment fragment) { FragmentTransaction ft = this.getSupportFragmentManager().beginTransaction(); ft.remove(fragment); ft.commitAllowingStateLoss(); } /** * 显示Fragment **/ public void showFragment(Fragment fragment) { FragmentTransaction ft = this.getSupportFragmentManager().beginTransaction(); if (homepageFragment != null) { ft.hide(homepageFragment); } if (shoppingFragment != null) { ft.hide(shoppingFragment); } if (communityFragment != null) { ft.hide(communityFragment); } if (communcationFragment != null) { ft.hide(communcationFragment); } if (personFragment != null) { ft.hide(personFragment); } ft.show(fragment); ft.commitAllowingStateLoss(); } }
千万不要忘记在xml文件中要写好点击事件onClick。之后我再列出一个fragment的代码，我这里5个fragment我就不一一列出啦
HomePageFragment:
package com.example.tab; import android.os.Bundle; import android.support.v4.app.Fragment; import android.view.LayoutInflater; import android.view.View; import android.view.ViewGroup; public class HomepageFragment extends Fragment { View view; @Override public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) { view=inflater.inflate(R.layout.fragment_3,container,false); return view; } }fragment_3:
<?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"> <TextView android:layout_width="match_parent" android:layout_height="wrap_content" android:text="hello3"/> </LinearLayout>写到这里功能就可以实现了，代码很简单，一定要细心。
9575
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
