感谢大神的分享的demo，demo地址
鉴于对于自己的学习，已经控制自己，我打算将其写成一篇博客，这是第一篇关于SlidingMenu布局的书写.
我在原作者的基础上使用了xUtils框架
框架地址
高仿糗事百科的界面是通过Fragment实现的
在main_activity中只有简单的帧布局FrameLayout
以下是main_activity的代码
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="@+id/main"
android:layout_width="match_parent"
android:layout_height="match_parent"
>
</FrameLayout>通过帧布局我们在MainActivity中只需要通过FragmentManager来获取fragment替代帧布局的main就行，具体代码如下
mFragmentManager = MainActivity.this.getSupportFragmentManager();
mFragmentTransaction = mFragmentManager.beginTransaction();
//替换Fragment
FragmentTransaction mFragmentTransaction = mFragmentManager
.beginTransaction();
mFragmentTransaction.replace(R.id.main, mHotFragment);
mFragmentTransaction.commit();下面就开始关于SlidingMenu布局的说明
布局其实并不复杂，具体代码如下:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:background="#413A30"
android:layout_width="match_parent"
android:layout_height="match_parent">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="@mipmap/menu_title_bg">
<LinearLayout
android:id="@+id/SettingBtnlayout"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_centerVertical="true"
android:orientation="horizontal">
<ImageView
android:id="@+id/SettingBtn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:paddingLeft="10dp"
android:paddingRight="10dp"
android:src="@mipmap/side_setting_icon"/>
</LinearLayout>
<LinearLayout
android:id="@+id/SettingBtnShuxian"
android:layout_width="1dp"
android:layout_height="wrap_content"
android:layout_toLeftOf="@id/SettingBtnlayout"
android:orientation="horizontal"
android:background="@mipmap/side_menu_col">
</LinearLayout>
<LinearLayout
android:id="@+id/LoginThisApp"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignBottom="@id/SettingBtnlayout"
android:layout_alignTop="@id/SettingBtnlayout"
android:layout_centerVertical="true"
android:layout_toLeftOf="@id/SettingBtnShuxian"
android:gravity="center_vertical"
android:orientation="horizontal"
android:paddingLeft="8dp"
>
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="@mipmap/side_button_background"
android:src="@mipmap/side_user_avatar"/>
<TextView
android:id="@+id/myUserName"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp"
android:gravity="center_vertical|center_horizontal"
android:padding="5dp"
android:text="登录糗百"
android:textColor="#ffffff"
android:textSize="16sp" />
</LinearLayout>
</RelativeLayout>
<ScrollView
android:layout_width="match_parent"
android:layout_height="wrap_content">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<RelativeLayout
android:id="@+id/LeftHot"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="@drawable/leftview_list_bg">
<TextView
android:text="热门"
android:textColor="#ffffff"
android:textSize="16sp"
android:paddingLeft="10dp"
android:layout_centerVertical="true"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:src="@mipmap/menu_more_details" />
</RelativeLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="2dp"
android:background="@mipmap/menu_seperator" >
</LinearLayout>
<RelativeLayout
android:id="@+id/LeftNice"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="@drawable/leftview_list_bg">
<TextView
android:text="精华"
android:textColor="#ffffff"
android:textSize="16sp"
android:paddingLeft="10dp"
android:layout_centerVertical="true"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:src="@mipmap/menu_more_details" />
</RelativeLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="2dp"
android:background="@mipmap/menu_seperator" >
</LinearLayout>
<RelativeLayout
android:id="@+id/LeftPicture"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="@drawable/leftview_list_bg">
<TextView
android:text="有图有真相"
android:textColor="#ffffff"
android:textSize="16sp"
android:paddingLeft="10dp"
android:layout_centerVertical="true"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:src="@mipmap/menu_more_details" />
</RelativeLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="2dp"
android:background="@mipmap/menu_seperator" >
</LinearLayout>
<RelativeLayout
android:id="@+id/LeftCross"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="@drawable/leftview_list_bg" >
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_marginLeft="10dp"
android:text="穿越"
android:textColor="#ffffff"
android:textSize="16sp" />
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:src="@mipmap/menu_more_details" />
</RelativeLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="2dp"
android:background="@mipmap/menu_seperator" >
</LinearLayout>
<RelativeLayout
android:id="@+id/LeftScrip"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="10dp"
android:background="@drawable/leftview_list_bg" >
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_marginLeft="10dp"
android:text="小纸条"
android:textColor="#ffffff"
android:textSize="16sp" />
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:src="@mipmap/menu_more_details" />
</RelativeLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="2dp"
android:background="@mipmap/menu_seperator" >
</LinearLayout>
<RelativeLayout
android:id="@+id/LeftNear"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="@drawable/leftview_list_bg" >
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_marginLeft="10dp"
android:text="附近"
android:textColor="#ffffff"
android:textSize="16sp" />
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:src="@mipmap/menu_more_details" />
</RelativeLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="2dp"
android:background="@mipmap/menu_seperator" >
</LinearLayout>
<RelativeLayout
android:id="@+id/LeftCheck"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="10dp"
android:background="@drawable/leftview_list_bg" >
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_marginLeft="10dp"
android:text="审核新糗事"
android:textColor="#ffffff"
android:textSize="16sp" />
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:src="@mipmap/menu_more_details" />
</RelativeLayout>
<RelativeLayout
android:id="@+id/LeftCheck11111111111"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="10dp"
android:background="@drawable/leftview_list_bg" >
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_marginLeft="10dp"
android:text=""
android:textColor="#ffffff"
android:textSize="16sp" />
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_centerVertical="true"
android:src="@mipmap/menu_more_details" />
</RelativeLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="2dp"
android:background="@mipmap/menu_seperator" >
</LinearLayout>
</LinearLayout>
</ScrollView>
</LinearLayout>大的布局就两块一个RelativeLayout是登陆部分的布局
另外一个就是ScrollView是具体菜单的布局
布局方面已经完成下面就该是加载到视图中了
@ContentView(R.layout.activity_main)
public class MainActivity extends SlidingFragmentActivity {
private KFSettingsManager mSettingsMgr;
private View mLeftView;
//SlidingMenu
private SlidingMenu mSlidingMenu;
// 热门的碎片
private HotFragment mHotFragment;
// 精华的碎片
private NiceFragment mNiceFragment;
// 有图有真相的碎片
private PictureFragment mPictureFragment;
// 穿越的碎片
private CrossFragment mCrossFragment;
// 小纸条的碎片
private NotesFragment mNotesFragment;
// 附近的碎片
private NearFragment mNearFragment;
//Fragment管理器
private FragmentManager mFragmentManager;
// 获取fragment栈
private FragmentTransaction mFragmentTransaction;
private List<Fragment> myFragmentList = new ArrayList<Fragment>();
private int fragmentFlag = 0;
@ViewInject(R.id.myUserName)
private TextView myUserName;
@ViewInject(R.id.LoginThisApp)
private LinearLayout mLoginThisAPP;// 登录糗百按
@ViewInject(R.id.SettingBtn)
private ImageView mSettingBtn;// 设置按钮
// leftview中下面的按钮
@ViewInject(R.id.LeftHot)
private RelativeLayout mLeftHot;
@ViewInject(R.id.LeftNice)
private RelativeLayout mLeftNice;
@ViewInject(R.id.LeftPicture)
private RelativeLayout mLeftPicture;
@ViewInject(R.id.LeftCross)
private RelativeLayout mLeftCross;
@ViewInject(R.id.LeftScrip)
private RelativeLayout mLeftScrip;
@ViewInject(R.id.LeftNear)
private RelativeLayout mLeftNear;
@ViewInject(R.id.LeftCheck)
private RelativeLayout mLeftCheck; // leftview中下面的按钮
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
requestWindowFeature(Window.FEATURE_NO_TITLE);
mLeftView=View.inflate(MainActivity.this,R.layout.left_view,null);
x.view().inject(this,mLeftView);
initView();
mSettingsMgr = KFSettingsManager.getSettingsManager(this);
// 设置开发者调试模式，默认为true，如要关闭开发者模式，请设置为false
KFIMInterfaces.enableDebugMode(this, true);
login();
//数据本地化
SharedPreferences sp = MainActivity.this.getSharedPreferences(
"UserInfo", MODE_PRIVATE);
String result = sp.getString("UserInfoJson", "none");
Log.e("SharedPreferencesOld", result);
}
private void initView() {
mLeftHot.setBackgroundResource(R.mipmap.side_menu_background_active);
mHotFragment = new HotFragment();
myFragmentList.add(mHotFragment);
mNiceFragment = new NiceFragment();
myFragmentList.add(mNiceFragment);
mPictureFragment = new PictureFragment();
myFragmentList.add(mPictureFragment);
mCrossFragment = new CrossFragment();
myFragmentList.add(mCrossFragment);
mNotesFragment = new NotesFragment();
myFragmentList.add(mNotesFragment);
mNearFragment = new NearFragment();
myFragmentList.add(mNearFragment);
mSlidingMenu = this.getSlidingMenu();
//将leftview设置到slidingmenu
this.setBehindContentView(mLeftView);
设置阴影图片
mSlidingMenu.setShadowDrawable(R.mipmap.drawer_shadow);
//设置阴影图片的宽度
mSlidingMenu.setShadowWidthRes(R.dimen.shadow_width);
//设置划出时主页面显示的剩余宽度
mSlidingMenu.setBehindOffsetRes(R.dimen.slidingmenu_offset);
//滑动时的渐变程度
mSlidingMenu.setFadeDegree(0.35f);
//设置要使菜单滑动，触碰屏幕的范围
mSlidingMenu.setTouchModeAbove(SlidingMenu.TOUCHMODE_MARGIN);
//获取Fragment管理器
mFragmentManager = MainActivity.this.getSupportFragmentManager();
mFragmentTransaction = mFragmentManager.beginTransaction();
createFargment(5);
createFargment(1);
//替换Fragment
FragmentTransaction mFragmentTransaction = mFragmentManager
.beginTransaction();
mFragmentTransaction.replace(R.id.main, mHotFragment);
mFragmentTransaction.commit();
}
// 设置右边的fragment加载的控件
private void createFargment(int flag) {
// 如果正在加载的fragment是传过来的 那么就不操作否则就去加载
MainActivity.this.toggle();
if(fragmentFlag!=flag){
switch (flag){
case 1:// 热门的Fragment
hotFragmentCallBack();
break;
case 2:// 精华的Fragment
// niceFragmentCallBack();
break;
case 3:// 有图有真相的Fragment
// pictureFragmentCallBack();
break;
case 4:// 穿越的Fragment
// crossFragmentCallBack();
break;
case 5:// 小纸条的Fragment
// notesfragmentCallBack();
break;
case 6:// 附近的Fragment
// nearfragmentCallBack();
break;
}
if (fragmentFlag != 0) {
mFragmentTransaction.remove(myFragmentList
.get(fragmentFlag - 1));
}
mFragmentTransaction = mFragmentManager.beginTransaction();
mFragmentTransaction.replace(R.id.main,
myFragmentList.get(flag - 1));
// 提交保存杠杆替换或者添加的fragment
mFragmentTransaction.commit();
fragmentFlag = flag;
}
}
@Event(value ={ R.id.LoginThisApp,R.id.SettingBtn,R.id.LeftHot,R.id.LeftNice,R.id.LeftPicture,R.id.LeftScrip,R.id.LeftNear,R.id.LeftCross,R.id.LeftCheck},type = View.OnClickListener.class)
private void OnClick(View v){
int mID = v.getId();
// MainActivity.this.toggle();
switch (mID) {
case R.id.LoginThisApp:
if (Model.MYUSERINFO != null) {
// Intent intent = new Intent(MainActivity.this,
// UserInfoActivity.class);
// Bundle bund = new Bundle();
// bund.putSerializable("UserInfo", Model.MYUSERINFO);
// intent.putExtra("value", bund);
// startActivity(intent);
} else {
// Intent intent = new Intent(MainActivity.this,
// LoginActivity.class);
// startActivity(intent);
}
break;
case R.id.SettingBtn:
Toast.makeText(MainActivity.this, "你好我是Xutils的IOC功能", Toast.LENGTH_SHORT).show();
//Intent intent = new Intent(MainActivity.this, SettingActivity.class);
// startActivity(intent);
break;
case R.id.LeftHot:
createleftviewbg();
mLeftHot.setBackgroundResource(R.mipmap.side_menu_background_active);
createFargment(1);
break;
case R.id.LeftNice:
createleftviewbg();
mLeftNice.setBackgroundResource(R.mipmap.side_menu_background_active);
createFargment(2);
break;
case R.id.LeftPicture:
createleftviewbg();
mLeftPicture.setBackgroundResource(R.mipmap.side_menu_background_active);
createFargment(3);
break;
case R.id.LeftCross:
createleftviewbg();
mLeftCross.setBackgroundResource(R.mipmap.side_menu_background_active);
createFargment(4);
break;
case R.id.LeftScrip:
createleftviewbg();
mLeftScrip.setBackgroundResource(R.mipmap.side_menu_background_active);
createFargment(5);
break;
case R.id.LeftNear:
createleftviewbg();
mLeftNear.setBackgroundResource(R.mipmap.side_menu_background_active);
createFargment(6);
break;
case R.id.LeftCheck:
createleftviewbg();
mLeftCheck.setBackgroundResource(R.mipmap.side_menu_background_active);
// 这里是跳转到审核糗事的activity中
// Intent intent1 = new Intent(MainActivity.this, AuditActivity.class);
//startActivity(intent1);
break;
default:
break;
}
}
// 设置leftview控件的默认背景色
private void createleftviewbg() {
mLeftHot.setBackgroundResource(R.drawable.leftview_list_bg);
mLeftNice.setBackgroundResource(R.drawable.leftview_list_bg);
mLeftPicture.setBackgroundResource(R.drawable.leftview_list_bg);
mLeftScrip.setBackgroundResource(R.drawable.leftview_list_bg);
mLeftNear.setBackgroundResource(R.drawable.leftview_list_bg);
mLeftCross.setBackgroundResource(R.drawable.leftview_list_bg);
mLeftCheck.setBackgroundResource(R.drawable.leftview_list_bg);
}
// 从hotfragment里面回调回来的事件监听设置方法
private void hotFragmentCallBack() {
mHotFragment.setCallBack(new MyHotFragmentCallBack());
}
private class MyHotFragmentCallBack implements HotFragment.HotFragmentCallBack {
@Override
public void callback(int flag) {
switch (flag) {
case R.id.Menu:
MainActivity.this.toggle();
break;
case R.id.SendAshamed:
/* if (Model.MYUSERINFO != null) {
Intent intent = new Intent(MainActivity.this,
UploadActivity.class);
startActivity(intent);
} else {
Intent intent = new Intent(MainActivity.this,
LoginActivity.class);
startActivity(intent);
} */
break;
default:
break;
}
}
}
@Override
protected void onRestart() {
super.onRestart();
if (Model.MYUSERINFO != null) {
myUserName.setText(Model.MYUSERINFO.getUname());
} else {
myUserName.setText("登录糗百");
}
//createFargment(fragmentFlag);
}
@Override
protected void onStart() {
if (Model.MYUSERINFO != null) {
myUserName.setText(Model.MYUSERINFO.getUname());
KFIMInterfaces.setVCardField(MainActivity.this, "NICKNAME",
Model.MYUSERINFO.getUname());
} else {
myUserName.setText("登录糗百");
}
super.onStart();
}
private void login() {
//检查 用户名/密码 是否已经设置,如果已经设置，则登录
if (!"".equals(mSettingsMgr.getUsername())
&& !"".equals(mSettingsMgr.getPassword()))
KFIMInterfaces.login(this, mSettingsMgr.getUsername(),
mSettingsMgr.getPassword());
// 设置个人资料"NICKNAME"
}
} 通过xUtils框架我们能省去一堆FindViewById()的代码，更有利于代码的观看，在这个控件的初始化上，我也是遇到了一些问题，这个问题在我另外一篇中讲的更加清楚。如果你不使用框架的话想要实例这些控件要记住先加载View视图，然后通过View.findViewByid()因为这些控件是在View中声明的并不是你setContent中的控件。
其次在InitView()方法中，我们有以下代码
mSlidingMenu = this.getSlidingMenu();
//将leftview设置到slidingmenu
this.setBehindContentView(mLeftView);
设置阴影图片
mSlidingMenu.setShadowDrawable(R.mipmap.drawer_shadow);
//设置阴影图片的宽度
mSlidingMenu.setShadowWidthRes(R.dimen.shadow_width);
//设置划出时主页面显示的剩余宽度
mSlidingMenu.setBehindOffsetRes(R.dimen.slidingmenu_offset);
//滑动时的渐变程度
mSlidingMenu.setFadeDegree(0.35f);
//设置要使菜单滑动，触碰屏幕的范围
mSlidingMenu.setTouchModeAbove(SlidingMenu.TOUCHMODE_MARGIN);
其中this.setBehindContentView(mLeftView);是必不可少的，这条代码是将视图加载到侧滑栏中，如果不设置将会报错。其他的就是设置侧滑栏的属性，用途都在注释中，如果你对更多的用法感兴趣，可以寻求度娘帮助。
Fragment是通过接口进行回调的
// 从hotfragment里面回调回来的事件监听设置方法
private void hotFragmentCallBack() {
mHotFragment.setCallBack(new MyHotFragmentCallBack());
}
private class MyHotFragmentCallBack implements HotFragment.HotFragmentCallBack {
@Override
public void callback(int flag) {
switch (flag) {
case R.id.Menu:
//显示关闭侧滑栏
MainActivity.this.toggle();
break;
case R.id.SendAshamed:
/* if (Model.MYUSERINFO != null) {
Intent intent = new Intent(MainActivity.this,
UploadActivity.class);
startActivity(intent);
} else {
Intent intent = new Intent(MainActivity.this,
LoginActivity.class);
startActivity(intent);
} */
break;
default:
break;
}
}
} 回调的作用，当我们进入了Fragment的时候，其实已经离开了当前的Activity而我们可以通过接口的方式将Activity的方法通过接口的方式添加到Fragment，这样我们就可以在Fragment中调用Activity中的方法了。
简点的讲述了MainActivity已经SlidingMenu的使用以及回调，书写不好请各位多多包涵，谢谢大家赏脸。
扫一扫
3166
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
