看了鴻洋大神做的微信5.1版本的東西,自己模仿着做了一下,現在總結一下。
有相應的代碼,可以下載下傳
微信的第一個RelativeLayout
在裡面攝者一個LinearLayout寬度設定為fill_parent,高度設定為40dp,裡面嵌套一個LinearLayout,這個LinearLayout由一個ImageView,Textview組成
第二個LinearLayout由三個ImageButton組成
微信的第二個LinearLayout
<?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="50dp"
android:background="#eee">
<LinearLayout
android:id="@+id/id_ll_chat"
android:layout_height="47dp"
android:layout_width="fill_parent"
android:orientation="horizontal">
<LinearLayout android:layout_height="fill_parent"
android:layout_width="fill_parent"
android:layout_weight="1"
android:orientation="horizontal"
android:gravity="center">
<TextView android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:text="聊天"
android:textColor="#000000"
android:id="@+id/tl"/>
</LinearLayout>
<LinearLayout android:layout_height="fill_parent"
android:layout_width="fill_parent"
android:layout_weight="1"
android:orientation="horizontal"
android:gravity="center">
<TextView android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:text="發現"
android:textColor="#000000"
android:id="@+id/tf"/>
</LinearLayout>
<LinearLayout android:layout_height="fill_parent"
android:layout_width="fill_parent"
android:layout_weight="1"
android:orientation="horizontal"
android:gravity="center">
<TextView android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:text="通訊錄"
android:textColor="#000000"
android:id="@+id/tt"/>
</LinearLayout>
</LinearLayout>
<ImageView
android:id="@+id/id_iv_tabline"
android:layout_width="127dp"
android:layout_height="3dp"
android:background="@drawable/tabline" />
</LinearLayout>
這個LinearLayout裡嵌套了三個LinearLayout,這三個LinearLayout裡,每個都有一個TextView,在最後的結尾加一個藍色的條
下面是主avtivity_main
<?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"
>
<include layout="@layout/shangyi"/>
<include layout="@layout/shanger"/>
<android.support.v4.view.ViewPager
android:id="@+id/id_viewpager"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1" />
</LinearLayout>
在裡面加入這兩個布局,在加入一個viewpager用于加入下面的可滑動的頁面
下面建立幾個布局檔案
裡面隻有textView,這幾個布局檔案的用處就是為fragment提供模闆,再分别建立相應的.java檔案,
下面我們在MainActivity裡進行設定
先要屏蔽actionbar
我們可以用這幾個方法
1.getActionbar().hide();
2.或在androidmanifest中設定設定android:theme=""
@style/Theme.AppCompat.Light.NoActionBar
下面是完整代碼
package com.example.window7.weixin;
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.util.DisplayMetrics;
import android.util.Log;
import android.view.Display;
import android.view.ViewGroup;
import android.widget.ImageView;
import android.widget.LinearLayout;
import android.widget.TextView;
import java.util.ArrayList;
import java.util.List;
public class MainActivity extends FragmentActivity {
private ViewPager mViewPager;
private FragmentPagerAdapter mAdapter;
private List<Fragment> mDatas;
private TextView mlTextView;
private TextView mfTextView;
private TextView mtTextView;
private LinearLayout mChatLinearLayout;
private ImageView mTabline;
private int mScreen1_3;
private int mCurrentPageIndex;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
initTabLine();
initView();
}
public void initTabLine()
{
mTabline=(ImageView)findViewById(R.id.id_iv_tabline);
//shezhi gensuitiao
Display display=getWindow().getWindowManager().getDefaultDisplay();
//shezhi display,dedao windoe.manager.defaultdisplay
DisplayMetrics outMetrics=new DisplayMetrics();
//shezhi displayMetrics new displayMetrics
display.getMetrics(outMetrics);
//dedao getMetrics(outMetrics)
//huozhe Display display=getWidow().getWindowManager().getDefaultDisplay;
mScreen1_3 = outMetrics.widthPixels / 3;
//tede kuanduwei zongpingde 1/3;
ViewGroup.LayoutParams lp = mTabline.getLayoutParams();
//dedao layoutParams dexinxi
lp.width = mScreen1_3;
//duitajinxing shezhi zhi
mTabline.setLayoutParams(lp);
}
private void initView()
{
mViewPager = (ViewPager) findViewById(R.id.id_viewpager);
// shezhi viewpager
mlTextView = (TextView) findViewById(R.id.tl);
//xianglimianjiaru gege textview;
mfTextView = (TextView) findViewById(R.id.tf);
//xianglimianjiaru gege textview;
mtTextView = (TextView) findViewById(R.id.tt);
//xianglimianjiaru gege textview;
mChatLinearLayout = (LinearLayout) findViewById(R.id.id_ll_chat);
//ba linearlayout jiaru
mDatas = new ArrayList<Fragment>();
//shezhi yige xinde arrayList;
YiFragment tab01 = new YiFragment();
//jiang gege Fragment xinjian;
ErFragment tab02 = new ErFragment();
//jiang gege Fragment xinjian;
SanFragment tab03 = new SanFragment();
//jiang gege Fragment xinjian;
mDatas.add(tab01);
//jiang ge ge fragment jiadao list li
mDatas.add(tab02);
//jiang ge ge fragment jiadao list li
mDatas.add(tab03);
//jiang ge ge fragment jiadao list li
mAdapter = new FragmentPagerAdapter(getSupportFragmentManager())
{
@Override
public int getCount()
{
return mDatas.size();
}
@Override
public Fragment getItem(int arg0)
{
return mDatas.get(arg0);
}
};
mViewPager.setAdapter(mAdapter);
//viewpager diaoyaong setAdapter(mAdapter);
mViewPager.setOnPageChangeListener(new ViewPager.OnPageChangeListener()
{
@Override
public void onPageSelected(int position)
{
resetTextView();
switch (position)
{
case 0:
mlTextView.setTextColor(Color.parseColor("#008000"));
break;
case 1:
mfTextView.setTextColor(Color.parseColor("#008000"));
break;
case 2:
mtTextView.setTextColor(Color.parseColor("#008000"));
break;
}
mCurrentPageIndex = position;
}
@Override
public void onPageScrolled(int position, float positionOffset,
int positionOffsetPx)
{
Log.e("TAG", position + " , " + positionOffset + " , "
+ positionOffsetPx);
LinearLayout.LayoutParams lp = (android.widget.LinearLayout.LayoutParams) mTabline
.getLayoutParams();
if (mCurrentPageIndex == 0 && position == 0)// 0->1
{
lp.leftMargin = (int) (positionOffset * mScreen1_3 + mCurrentPageIndex
* mScreen1_3);
} else if (mCurrentPageIndex == 1 && position == 0)// 1->0
{
lp.leftMargin = (int) (mCurrentPageIndex * mScreen1_3 + (positionOffset - 1)
* mScreen1_3);
} else if (mCurrentPageIndex == 1 && position == 1) // 1->2
{
lp.leftMargin = (int) (mCurrentPageIndex * mScreen1_3 + positionOffset
* mScreen1_3);
} else if (mCurrentPageIndex == 2 && position == 1) // 2->1
{
lp.leftMargin = (int) (mCurrentPageIndex * mScreen1_3 + ( positionOffset-1)
* mScreen1_3);
}
mTabline.setLayoutParams(lp);
}
@Override
public void onPageScrollStateChanged(int arg0)
{
// TODO Auto-generated method stub
}
});
}
protected void resetTextView()
{
mlTextView.setTextColor(Color.BLACK);
mfTextView.setTextColor(Color.BLACK);
mtTextView.setTextColor(Color.BLACK);
}
}