仿微信主界面及消息提醒

最新推荐文章于 2022-03-01 09:49:26 发布

u010542146

最新推荐文章于 2022-03-01 09:49:26 发布

阅读量1.7k

点赞数

分类专栏： android学习路

android学习路专栏收录该内容

91 篇文章 0 订阅

订阅专栏

涉及知识点

1.ViewPager
2.FragmentPagerAdapter
3.eclipse快捷键抽出代码作为方法： alt+shift+m
4.eclipse快捷键导入包： Ctrl+shift+o
5.eclipse快捷键全局修改名称： alt+shift+r
6.eclipse快捷键查找类的全名：Ctrl+shift+t
7.BadgeView GitHub地址：https://github.com/stefanjauker/BadgeView

效果
这里写图片描述

main.xml

<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/header"/>
    <include layout="@layout/header2"/>

     <android.support.v4.view.ViewPager 
         android:id="@+id/id_viewpager"
         android:layout_width="match_parent"
         android:layout_height="match_parent"/>


</LinearLayout>

header.xml

<RelativeLayout
    android:layout_width="match_parent"
    android:layout_height="40dp"
     xmlns:android="http://schemas.android.com/apk/res/android"
     android:background="#333" >

    <LinearLayout 
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentLeft="true"
        android:layout_centerVertical="true"
        >
         <ImageView 
            android:layout_marginLeft="5dp"
            android:layout_width="30dp"
            android:layout_height="30dp"
            android:src="@drawable/actionbar_icon"/>

        <TextView 
            android:textColor="#fff"
            android:layout_marginLeft="5dp"
            android:layout_width="wrap_content"
            android:layout_height="match_parent"
            android:gravity="center"
            android:text="微信"
            android:textSize="20dp"/>

    </LinearLayout>


    <LinearLayout 
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentRight="true"
         android:layout_centerVertical="true"
        >
         <ImageView 
             android:layout_marginRight="5dp"
            android:layout_width="30dp"
            android:layout_height="30dp"
            android:src="@drawable/actionbar_search_icon"/>
          <ImageView 
               android:layout_marginRight="5dp"
            android:layout_width="30dp"
            android:layout_height="30dp"
            android:src="@drawable/actionbar_add_icon"/>
           <ImageView 
                android:layout_marginRight="5dp"
            android:layout_width="30dp"
            android:layout_height="30dp"
            android:src="@drawable/actionbar_more_icon"/>



    </LinearLayout>


</RelativeLayout>

header2.xml

<LinearLayout 
    android:layout_width="match_parent"
    android:layout_height="32dp"
    android:orientation="vertical" xmlns:android="http://schemas.android.com/apk/res/android">

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="30dp"
    android:orientation="horizontal"
     android:background="#C2C2C2" >

    <LinearLayout 
        android:id="@+id/ll_chat"
        android:layout_width="0dp"
        android:layout_weight="1"
        android:layout_height="match_parent"
        android:gravity="center">
        <TextView 
            android:id="@+id/tv_chat"
            android:layout_width="wrap_content"
            android:layout_height="match_parent"
            android:text="聊天"
            android:gravity="center"
            android:textSize="20dp"
            android:textColor="#008000"/>

    </LinearLayout>

     <LinearLayout 
        android:layout_width="0dp"
        android:layout_weight="1"
        android:layout_height="match_parent"
        android:gravity="center">
        <TextView 
             android:id="@+id/tv_found"
            android:layout_width="wrap_content"
            android:layout_height="match_parent"
            android:text="发现"
            android:gravity="center"
            android:textSize="20dp"
            android:textColor="#000000"/>


    </LinearLayout>


      <LinearLayout 
        android:layout_width="0dp"
        android:layout_weight="1"
        android:layout_height="match_parent"
        android:gravity="center">
        <TextView 
             android:id="@+id/tv_contact"
            android:layout_width="wrap_content"
            android:layout_height="match_parent"
            android:text="通讯录"
            android:textSize="20dp"
            android:gravity="center"
            android:textColor="#000000"/>

    </LinearLayout>
    </LinearLayout>

      <ImageView 
          android:id="@+id/id_imageview"
          android:layout_width="100dp"
          android:layout_height="match_parent"
          android:background="@drawable/tabline"/>
</LinearLayout>

Fragment(3个都类似的)

package com.example.day0229.fragment;

import com.example.day0229.R;

import android.os.Bundle;
import android.support.v4.app.Fragment;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;

public class ChatMainTabFragment extends Fragment{

    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container,
            Bundle savedInstanceState) {
        return inflater.inflate(R.layout.chat_tab, container, false);
    }

}

chat_tab.xml

<RelativeLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent"
     xmlns:android="http://schemas.android.com/apk/res/android" >


    <TextView 
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="The First Tab"
        android:textSize="22sp"
        android:textStyle="bold"
        android:layout_centerInParent="true"/>

</RelativeLayout>

Main

package com.example.day0229;

import java.util.ArrayList;
import java.util.List;

import com.example.day0229.fragment.ChatMainTabFragment;
import com.example.day0229.fragment.ContactMainTabFragment;
import com.example.day0229.fragment.FoundMainTabFragment;
import com.jauker.widget.BadgeView;

import android.annotation.SuppressLint;
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.support.v4.view.ViewPager.OnPageChangeListener;
import android.util.DisplayMetrics;
import android.util.Log;
import android.view.Display;
import android.widget.ImageView;
import android.widget.LinearLayout;
import android.widget.LinearLayout.LayoutParams;
import android.widget.TextView;

public class MainActivity extends FragmentActivity {

    private ViewPager mViewPager;
    private List<Fragment> mDatas;
    private FragmentPagerAdapter mAdapter;

    private TextView mChatTextView;
    private TextView mFoundTextView;
    private TextView mContactTextView;

    private LinearLayout mLayoutChat;
    private BadgeView mBadgeView;

    private ImageView mTabLine;
    private int screen1_3 = 0;//屏幕的三分之一
    private int mCurrentPager = 0;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        init();

        setImageViewWidth();

    }

    @SuppressLint("NewApi")
    private void setImageViewWidth() {
        Display display = getWindow().getWindowManager().getDefaultDisplay();
        DisplayMetrics outMetrics = new DisplayMetrics();
        display.getMetrics(outMetrics);
        screen1_3 = outMetrics.widthPixels / 3;
        LinearLayout.LayoutParams lp =   (android.widget.LinearLayout.LayoutParams) mTabLine.getLayoutParams();
        lp.width = screen1_3;
        mTabLine.setLayoutParams(lp);
    }


    private void init() {
        mViewPager = (ViewPager) findViewById(R.id.id_viewpager);
        mChatTextView = (TextView) findViewById(R.id.tv_chat);
        mFoundTextView = (TextView) findViewById(R.id.tv_found);
        mContactTextView = (TextView) findViewById(R.id.tv_contact);
        mLayoutChat = (LinearLayout) findViewById(R.id.ll_chat);

        mBadgeView = new BadgeView(MainActivity.this);
        mBadgeView.setBadgeCount(8);
        mLayoutChat.addView(mBadgeView);

        mTabLine = (ImageView) findViewById(R.id.id_imageview);

        mDatas = new ArrayList<Fragment>();
        ChatMainTabFragment tab01 = new ChatMainTabFragment();
        FoundMainTabFragment tab02 = new FoundMainTabFragment();
        ContactMainTabFragment tab03 = new ContactMainTabFragment();
        mDatas.add(tab01);  
        mDatas.add(tab02);  
        mDatas.add(tab03);  

        mAdapter = new FragmentPagerAdapter(getSupportFragmentManager()) {

            @Override
            public int getCount() {
                return mDatas.size();
            }

            @Override
            public Fragment getItem(int arg0) {
                return mDatas.get(arg0);
            }
        };

        mViewPager.setAdapter(mAdapter);
        mViewPager.setOnPageChangeListener(new OnPageChangeListener() {

            @Override
            public void onPageSelected(int position) {
                resetTextViewColor();
                switch (position) {
                case 0:
                    mChatTextView.setTextColor(Color.parseColor("#008000"));
                    break;
                case 1:
                    mFoundTextView.setTextColor(Color.parseColor("#008000"));
                    break;
                case 2:
                    mContactTextView.setTextColor(Color.parseColor("#008000"));
                    break;
                }

                mCurrentPager = position;
            }

            @Override
            public void onPageScrolled(int position, float positionOffset, int positionOffsetPx) {

                LinearLayout.LayoutParams lp = (LayoutParams) mTabLine.getLayoutParams();
                if (mCurrentPager == 0 && position == 0 || mCurrentPager == 1 && position == 0) {
                    lp.leftMargin = (int) (screen1_3 * positionOffset);
                } else if (mCurrentPager == 1 && position == 1 || mCurrentPager == 2 && position == 1) {
                    lp.leftMargin = (int) (screen1_3 * positionOffset) + screen1_3;
                }
                mTabLine.setLayoutParams(lp);

            }

            @Override
            public void onPageScrollStateChanged(int arg0) {

            }
        });
    }
    protected void resetTextViewColor() {
        mChatTextView.setTextColor(Color.BLACK);
        mFoundTextView.setTextColor(Color.BLACK);
        mContactTextView.setTextColor(Color.BLACK);

    }


}