仿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
浙公网安备 33010602011771号