zoukankan      html  css  js  c++  java
  • 仿oschina 主界面的实现(二) -------Toolbar + DrawerLayout




    側栏參考 http://blog.csdn.net/u012938203/article/details/47439281

    ListView http://blog.csdn.net/u012938203/article/details/47448333


    1.加入actionbar   custom_toolbar.xml

    <?xml version="1.0" encoding="utf-8"?>
    <android.support.v7.widget.Toolbar xmlns:android="http://schemas.android.com/apk/res/android"
        xmlns:app="http://schemas.android.com/apk/res-auto"
        android:id="@+id/my_awesome_toolbar"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="?attr/colorPrimary"
        android:minHeight="?

    attr/actionBarSize" android:popupTheme="@style/ThemeOverlay.AppCompat.Light" app:theme="@style/ThemeOverlay.AppCompat.ActionBar"> </android.support.v7.widget.Toolbar>

    2.改动主题风格  styles.xml

    <resources>
    
        <!--
            Base application theme, dependent on API level. This theme is replaced
            by AppBaseTheme from res/values-vXX/styles.xml on newer devices.
        -->
        <style name="AppBaseTheme" parent="android:Theme.Light">
            <!--
                Theme customizations available in newer API levels can go in
                res/values-vXX/styles.xml, while customizations related to
                backward-compatibility can go here.
            -->
        </style>
    
        <!-- Application theme. -->
        <style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
            <!--状态栏颜色-->
            <item name="colorPrimaryDark">@color/Indigo_colorPrimaryDark</item>
            <!--Toolbar颜色-->
            <item name="colorPrimary">@color/Indigo_colorPrimary</item>
            <!--返回键样式-->
            <item name="drawerArrowStyle">@style/AppTheme.DrawerArrowToggle</item>
        </style>
        <style name="AppTheme.DrawerArrowToggle" parent="Base.Widget.AppCompat.DrawerArrowToggle">
            <item name="color">@android:color/white</item>
        </style>
    
    </resources>
    

    主界面代码MainActivity
    package com.skyfin.oschina;
    
    import java.util.ArrayList;
    import java.util.HashMap;
    import java.util.Map;
    
    import android.R.string;
    import android.app.Activity;
    import android.graphics.Color;
    import android.graphics.drawable.AnimationDrawable;
    import android.os.Bundle;
    import android.support.v4.app.FragmentActivity;
    import android.support.v4.app.FragmentTabHost;
    import android.support.v4.widget.DrawerLayout;
    import android.support.v7.app.ActionBarActivity;
    import android.support.v7.app.ActionBarDrawerToggle;
    import android.support.v7.widget.Toolbar;
    import android.util.Log;
    import android.view.LayoutInflater;
    import android.view.Menu;
    import android.view.MenuItem;
    import android.view.View;
    import android.view.View.OnClickListener;
    import android.widget.AdapterView;
    import android.widget.AdapterView.OnItemClickListener;
    import android.widget.ArrayAdapter;
    import android.widget.ImageView;
    import android.widget.ListView;
    import android.widget.SimpleAdapter;
    import android.widget.TabHost.OnTabChangeListener;
    import android.widget.Toast;
    import android.widget.TabHost.TabSpec;
    import android.widget.TextView;
    import android.widget.TabHost.TabContentFactory;
    
    public class MainActivity extends ActionBarActivity {
    
    	//工具条
    	private Toolbar mtoolbar;
    	//側滑主框架
    	private DrawerLayout mDrawerLayout;
    	//监听toolbar上button
    	private ActionBarDrawerToggle mDrawerToggle;
    	//左側側滑的listview
    	private ListView lvLeftMenu;
    	//listview 的title名字
    	private String[] ListMunuItemArray = {"技术问答","开源软件","博客区","Gitclient"};  
    	//listview的图片资源
    	private int[] ListMenuImageArray = {R.drawable.drawer_menu_icon_quest_nor,R.drawable.drawer_menu_icon_opensoft_nor  
    	        ,R.drawable.drawer_menu_icon_blog_nor,R.drawable.drawer_menu_icon_gitapp_nor};  
    	//listview的适配容器
    	ArrayList<Map<String,Object>> mData= new ArrayList<Map<String,Object>>();  
    	private ArrayAdapter arrayAdapter;
    	//切换动画
    	private AnimationDrawable mAnimationDrawable;
    	String old_tag;
    	//tab框架的实例
    	private MyFragmentTabHost mTabHost;
    
    	private LayoutInflater layoutInflater;
    	
    	//中间的加入button
    	private View fragmentQuickoption;
    	//tab 框架的资源
    	private Class fragmentArray[] = { FragmentNews.class, FragmentTweet.class,
    			FragmentQuickoption.class, FragmentExplore.class, FragmentMe.class };
    	//tab 的资源
    	private int mImageArray[] = { R.drawable.main_tab_news,
    			R.drawable.main_tab_tweet, R.drawable.main_tab_quickoption,
    			R.drawable.main_tab_explore, R.drawable.main_tab_me };
    
    	private String mTextArray[] = { "综合", "动弹", "加入", "发现", "我" };
    
    	@Override
    	protected void onCreate(Bundle savedInstanceState) {
    		super.onCreate(savedInstanceState);
    		setContentView(R.layout.activity_main);
    		initView();
    		findViews();
    	       //京东RunningMan动画效果,和本次Toolbar无关
            //mAnimationDrawable = (AnimationDrawable) ivRunningMan.getBackground();
            //mAnimationDrawable.start();
            mtoolbar.setTitle("Toolbar");//设置Toolbar标题
            mtoolbar.setTitleTextColor(Color.parseColor("#ffffff")); //设置标题颜色
            setSupportActionBar(mtoolbar);
            getSupportActionBar().setHomeButtonEnabled(true); //设置返回键可用
            getSupportActionBar().setDisplayHomeAsUpEnabled(true);
            //创建返回键,并实现打开关/闭监听
            mDrawerToggle = new ActionBarDrawerToggle(this, mDrawerLayout, mtoolbar, R.string.open, R.string.close) {
                @Override
                public void onDrawerOpened(View drawerView) {
                    super.onDrawerOpened(drawerView);
                    //mAnimationDrawable.stop();
                }
                @Override
                public void onDrawerClosed(View drawerView) {
                    super.onDrawerClosed(drawerView);
                    //mAnimationDrawable.start();
                }
            };
            mDrawerToggle.syncState();
            mDrawerLayout.setDrawerListener(mDrawerToggle);
            
            int lengh = ListMunuItemArray.length;    
            for(int i =0; i < lengh; i++) {    
                Map<String,Object> item = new HashMap<String,Object>();    
                item.put("image", ListMenuImageArray[i]);    
                item.put("title", ListMunuItemArray[i]);    
                mData.add(item);     
            }
            SimpleAdapter adapter = new SimpleAdapter(this,mData,R.layout.menu_item,    
                    new String[]{"image","title"},new int[]{R.id.menu_image,R.id.menu_title});     
       
            //设置菜单列表
            lvLeftMenu.setAdapter(adapter);
            //側滑菜单的监听
            lvLeftMenu.setOnItemClickListener(new OnItemClickListener() {    
                @Override    
                public void onItemClick(AdapterView<?

    > adapterView, View view, int position, long id) { //Toast.makeText(getApplicationContext(),position, Toast.LENGTH_SHORT).show(); } }); } private void initView() { // 实例化布局对象 layoutInflater = LayoutInflater.from(this); // 实例化TabHost对象。得到TabHost mTabHost = (MyFragmentTabHost) findViewById(android.R.id.tabhost); mTabHost.setup(this, getSupportFragmentManager(), R.id.realtabcontent); // 得到fragment的个数 int count = fragmentArray.length; for (int i = 0; i < count; i++) { // View indicator = // LayoutInflater.from(getApplicationContext()).inflate(R.layout.tab_item_btn_view, // null); // 为每个Tabbutton设置图标、文字和内容 TabSpec tabSpec = mTabHost.newTabSpec(mTextArray[i]).setIndicator( getTabItemView(i)); // 将Tabbutton加入进Tab选项卡中 if (i == 2) { //设置中间的加入button不可用 mTabHost.setNoTabChangedTag(mTextArray[i]); } mTabHost.addTab(tabSpec, fragmentArray[i], null); // 设置Tabbutton的背景 mTabHost.getTabWidget().getChildAt(i) .setBackgroundResource(R.color.Fragment_tab_bg); // 去掉竖线 mTabHost.getTabWidget().setDividerDrawable(null); } // 设置button的监听 mTabHost.setOnTabChangedListener(new OnTabChangedListener()); } private void findViews() { mtoolbar = (Toolbar) findViewById(R.id.my_awesome_toolbar); mDrawerLayout = (DrawerLayout) findViewById(R.id.dl_left); lvLeftMenu = (ListView) findViewById(R.id.lv_left_menu); } /** * button的监听的类 * * @author Skyfin * */ class OnTabChangedListener implements OnTabChangeListener { @Override public void onTabChanged(String tabId) { // TODO Auto-generated method stub // Toast.makeText(getApplication(), // tabId,Toast.LENGTH_SHORT).show(); if (old_tag != tabId) { Toast.makeText(getApplicationContext(), tabId, Toast.LENGTH_SHORT).show(); } else { Toast.makeText(getApplicationContext(), "加入", Toast.LENGTH_SHORT).show(); } old_tag = tabId; } } /** * 给Tabbutton设置图标和文字 */ private View getTabItemView(int index) { View view = layoutInflater.inflate(R.layout.tab_item_view, null); if (index != 2) { ImageView imageView = (ImageView) view.findViewById(R.id.imageview); imageView.setImageResource(mImageArray[index]); TextView textView = (TextView) view.findViewById(R.id.textview); textView.setText(mTextArray[index]); } else { view = layoutInflater.inflate(R.layout.tab_item_btn_view, null); ImageView imageView = (ImageView) view.findViewById(R.id.imageview); imageView.setImageResource(mImageArray[index]); } return view; } @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); } }


    dome 下载:http://pan.baidu.com/s/1sjEAmbb

  • 相关阅读:
    Two Sum II
    Subarray Sum
    Intersection of Two Arrays
    Reorder List
    Convert Sorted List to Binary Search Tree
    Remove Duplicates from Sorted List II
    Partition List
    Linked List Cycle II
    Sort List
    struts2结果跳转和参数获取
  • 原文地址:https://www.cnblogs.com/yjbjingcha/p/7073474.html
Copyright © 2011-2022 走看看