zoukankan      html  css  js  c++  java
  • Android仿微信界面--使用Fragment实现(慕课网笔记)

    1 效果图 
    这里写图片描述 
    这里我们没有实现滑动切换view的功能 
    2 具体实现: 
    2.1 布局文件:top.xml, bottom.xml,tab01.xml,tab02.xml,tab03.xml,tab04.xml 
    具体请参考上述博客 
    2.2 新建4个Fragment,WeixinFragment,FrdFragment,AddressFragment,SettingFragment,分别对应tab01.xml,tab02.xml,tab03.xml,tab04.xml,其中这个Fragment是android.support.v4.app下面的(为了更好的兼容低版本的安卓设备),此时注意,以下凡是用到的Fragment都要是android.support.v4.app下的,这样不易出问题。 
    WeixinFragment

    package com.example.imooc_weixinfragment;
    import android.os.Bundle;
    import android.support.v4.app.Fragment;
    import android.view.LayoutInflater;
    import android.view.View;
    import android.view.ViewGroup;
    
    public class WeixinFragment extends Fragment {
        @Override
        public View onCreateView(LayoutInflater inflater, ViewGroup container,
                Bundle savedInstanceState) {
            //引入我们的布局
            return inflater.inflate(R.layout.tab01, container, false);
        }
    
    }

    FrdFragment

    package com.example.imooc_weixinfragment;
    
    import android.os.Bundle;
    import android.support.v4.app.Fragment;
    import android.view.LayoutInflater;
    import android.view.View;
    import android.view.ViewGroup;
    
    public class FrdFragment extends Fragment {
        @Override
        public View onCreateView(LayoutInflater inflater, ViewGroup container,
                Bundle savedInstanceState) {
            //引入我们的布局
            return inflater.inflate(R.layout.tab02, container, false);
        }
    
    }

    AddressFragment

    package com.example.imooc_weixinfragment;
    
    import android.os.Bundle;
    import android.support.v4.app.Fragment;
    import android.view.LayoutInflater;
    import android.view.View;
    import android.view.ViewGroup;
    
    public class AddressFragment extends Fragment {
        @Override
        public View onCreateView(LayoutInflater inflater, ViewGroup container,
                Bundle savedInstanceState) {
            //引入我们的布局
            return inflater.inflate(R.layout.tab03, container, false);
        }
    
    }

    SettingFragment

    package com.example.imooc_weixinfragment;
    
    import android.os.Bundle;
    import android.support.v4.app.Fragment;
    import android.view.LayoutInflater;
    import android.view.View;
    import android.view.ViewGroup;
    
    public class SettingFragment extends Fragment {
        @Override
        public View onCreateView(LayoutInflater inflater, ViewGroup container,
                Bundle savedInstanceState) {
            //引入我们的布局
            return inflater.inflate(R.layout.tab04, container, false);
        }
    
    }

    activity_main.xml,这里我们使用FrameLayout代替viewPager

    <LinearLayout 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"
        android:orientation="vertical"
        >
    
       <include layout="@layout/top"/>
        <FrameLayout
            android:id="@+id/id_content"
            android:layout_weight="1"
            android:layout_width="match_parent"
            android:layout_height="0dp">
    
        </FrameLayout>
       <include layout="@layout/bottom"/>
    
    </LinearLayout>

    2.3 MainActivity

    package com.example.imooc_weixinfragment;
    
    import android.app.Activity;
    import android.os.Bundle;
    import android.support.v4.app.Fragment;
    import android.support.v4.app.FragmentActivity;
    import android.support.v4.app.FragmentManager;
    import android.support.v4.app.FragmentTransaction;
    import android.view.Menu;
    import android.view.MenuItem;
    import android.view.View;
    import android.view.Window;
    import android.view.View.OnClickListener;
    import android.widget.ImageButton;
    import android.widget.LinearLayout;
    
    //我们使用的是android v4包下的fragment,这里必须要继承自FragmentActivity,而不是Activity
    public class MainActivity extends FragmentActivity implements OnClickListener{
        //底部的4个导航控件
        private LinearLayout mTabWeixin;
        private LinearLayout mTabFrd;
        private LinearLayout mTabAddress;
        private LinearLayout mTabSetting;
        //底部4个导航控件中的图片按钮
        private ImageButton mImgWeixin;
        private ImageButton mImgFrd;
        private ImageButton mImgAddress;
        private ImageButton mImgSetting;
        //初始化4个Fragment
        private Fragment tab01;
        private Fragment tab02;
        private Fragment tab03;
        private Fragment tab04;
    
        @Override
        protected void onCreate(Bundle savedInstanceState) {
            super.onCreate(savedInstanceState);
            requestWindowFeature(Window.FEATURE_NO_TITLE);
            setContentView(R.layout.activity_main);
            initView();//初始化所有的view
            initEvents();
            setSelect(0);//默认显示微信聊天界面
        }
    
        private void initEvents() {
            mTabWeixin.setOnClickListener(this);
            mTabFrd.setOnClickListener(this);
            mTabAddress.setOnClickListener(this);
            mTabSetting.setOnClickListener(this);
    
        }
    
        private void initView() {
            mTabWeixin = (LinearLayout)findViewById(R.id.id_tab_weixin);
            mTabFrd = (LinearLayout)findViewById(R.id.id_tab_frd);
            mTabAddress = (LinearLayout)findViewById(R.id.id_tab_address);
            mTabSetting = (LinearLayout)findViewById(R.id.id_tab_setting);
            mImgWeixin = (ImageButton)findViewById(R.id.id_tab_weixin_img);
            mImgFrd = (ImageButton)findViewById(R.id.id_tab_frd_img);
            mImgAddress = (ImageButton)findViewById(R.id.id_tab_address_img);
            mImgSetting = (ImageButton)findViewById(R.id.id_tab_setting_img);
    
        }
    
        @Override
        public boolean onCreateOptionsMenu(Menu menu) {
            // Inflate the menu; this adds items to the action bar if it is present.
            getMenuInflater().inflate(R.menu.main, menu);
            return true;
        }
    
        @Override
        public boolean onOptionsItemSelected(MenuItem item) {
            // Handle action bar item clicks here. The action bar will
            // automatically handle clicks on the Home/Up button, so long
            // as you specify a parent activity in AndroidManifest.xml.
            int id = item.getItemId();
            if (id == R.id.action_settings) {
                return true;
            }
            return super.onOptionsItemSelected(item);
        }
    
        @Override
        public void onClick(View v) {
            resetImg();
            switch (v.getId()) {
            case R.id.id_tab_weixin://当点击微信按钮时,切换图片为亮色,切换fragment为微信聊天界面
                setSelect(0);
                break;
            case R.id.id_tab_frd:
                setSelect(1);
                break;
            case R.id.id_tab_address:
                setSelect(2);
                break;
            case R.id.id_tab_setting:
                setSelect(3);
                break;
    
            default:
                break;
            }
    
        }
    
        /*
         * 将图片设置为亮色的;切换显示内容的fragment
         * */
        private void setSelect(int i) {
            FragmentManager fm = getSupportFragmentManager();
            FragmentTransaction transaction = fm.beginTransaction();//创建一个事务
            hideFragment(transaction);//我们先把所有的Fragment隐藏了,然后下面再开始处理具体要显示的Fragment
            switch (i) {
            case 0:
                if (tab01 == null) {
                    tab01 = new WeixinFragment();
                    /*
                     * 将Fragment添加到活动中,public abstract FragmentTransaction add (int containerViewId, Fragment fragment)
                    *containerViewId即为Optional identifier of the container this fragment is to be placed in. If 0, it will not be placed in a container.
                     * */
                    transaction.add(R.id.id_content, tab01);//将微信聊天界面的Fragment添加到Activity中
                }else {
                    transaction.show(tab01);
                }
                mImgWeixin.setImageResource(R.drawable.tab_weixin_pressed);
                break;
            case 1:
                if (tab02 == null) {
                    tab02 = new FrdFragment();
                    transaction.add(R.id.id_content, tab02);
                }else {
                    transaction.show(tab02);
                }
                mImgFrd.setImageResource(R.drawable.tab_find_frd_pressed);
                break;
            case 2:
                if (tab03 == null) {
                    tab03 = new AddressFragment();
                    transaction.add(R.id.id_content, tab03);
                }else {
                    transaction.show(tab03);
                }
                mImgAddress.setImageResource(R.drawable.tab_address_pressed);
                break;
            case 3:
                if (tab04 == null) {
                    tab04 = new SettingFragment();
                    transaction.add(R.id.id_content, tab04);
                }else {
                    transaction.show(tab04);
                }
                mImgSetting.setImageResource(R.drawable.tab_settings_pressed);
                break;
    
            default:
                break;
            }
            transaction.commit();//提交事务
        }
    
        /*
         * 隐藏所有的Fragment
         * */
        private void hideFragment(FragmentTransaction transaction) {
            if (tab01 != null) {
                transaction.hide(tab01);
            }
            if (tab02 != null) {
                transaction.hide(tab02);
            }
            if (tab03 != null) {
                transaction.hide(tab03);
            }
            if (tab04 != null) {
                transaction.hide(tab04);
            }
    
        }
    
        private void resetImg() {
            mImgWeixin.setImageResource(R.drawable.tab_weixin_normal);
            mImgFrd.setImageResource(R.drawable.tab_find_frd_normal);
            mImgAddress.setImageResource(R.drawable.tab_address_normal);
            mImgSetting.setImageResource(R.drawable.tab_settings_normal);
        }
    }

    源码在这里:http://download.csdn.net/detail/hnyzwtf/9356533

  • 相关阅读:
    分布式缓存memcached介绍,win7环境安装,常用命令set,get,delete,stats, java访问
    【转】移除HTML5 input在type="number"时的上下小箭头
    ES6特性的两点分析
    hexo_config.yml配置内容
    JS性能分析(测试代码运行时间)
    github修改仓库项目的语言类型
    JavaScript回文数
    JS设计模式
    webpac入门
    居中问题
  • 原文地址:https://www.cnblogs.com/zhujiabin/p/5382418.html
Copyright © 2011-2022 走看看