码迷,mamicode.com
首页 > 其他好文 > 详细

侧滑UI

时间:2016-05-13 08:01:12      阅读:286      评论:0      收藏:0      [点我收藏+]

标签:

1、视图

activity_main.xml

 1 <com.zyhui.cehua.SlidingMenu 
 2     xmlns:android="http://schemas.android.com/apk/res/android"
 3     xmlns:tools="http://schemas.android.com/tools"
 4     android:layout_width="wrap_content"
 5     android:layout_height="match_parent"
 6     android:id="@+id/menu"
 7     android:background="#ffffff"
 8     android:scrollbars="none"
 9     android:fadingEdge="none"
10      >
11 
12     <LinearLayout
13         android:layout_width="wrap_content"
14         android:layout_height="fill_parent"
15         android:orientation="horizontal" >
16         <include layout="@layout/menu" />
17         <LinearLayout
18             android:layout_width="fill_parent"
19             android:layout_height="fill_parent"
20             android:background="#0000ff"
21             >
22             
23         </LinearLayout>
24     </LinearLayout>
25 
26 </com.zyhui.cehua.SlidingMenu>

menu.xml

 1 <?xml version="1.0" encoding="utf-8"?>
 2 <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
 3     android:layout_width="wrap_content"
 4     android:layout_height="wrap_content"
 5     android:background="#00ff00"
 6     android:orientation="vertical" >
 7     <Button 
 8         android:id="@+id/btn"
 9         android:layout_width="wrap_content"
10         android:layout_height="wrap_content"
11         android:text="abc"
12         />
13 
14 </LinearLayout>

2、清单文件

 1 <?xml version="1.0" encoding="utf-8"?>
 2 <manifest xmlns:android="http://schemas.android.com/apk/res/android"
 3     package="com.zyhui.cehua"
 4     android:versionCode="1"
 5     android:versionName="1.0" >
 6 
 7     <uses-sdk
 8         android:minSdkVersion="16"
 9         android:targetSdkVersion="16" />
10 
11     <application
12         android:allowBackup="true"
13         android:icon="@drawable/ic_launcher"
14         android:label="@string/app_name"
15         android:theme="@style/AppTheme" >
16         <activity
17             android:name="com.zyhui.cehua.MainActivity"
18             android:label="@string/app_name" 
19             android:theme="@android:style/Theme.NoTitleBar"
20             >
21             <intent-filter>
22                 <action android:name="android.intent.action.MAIN" />
23 
24                 <category android:name="android.intent.category.LAUNCHER" />
25             </intent-filter>
26         </activity>
27     </application>
28 
29 </manifest>

3、MainActivity

 1 package com.zyhui.cehua;
 2 
 3 import android.os.Bundle;
 4 import android.view.View;
 5 import android.view.View.OnClickListener;
 6 import android.widget.Button;
 7 import android.app.Activity;
 8 
 9 public class MainActivity extends Activity {
10     private SlidingMenu sdMenu;
11     private Button btn;
12     @Override
13     protected void onCreate(Bundle savedInstanceState) {
14         super.onCreate(savedInstanceState);
15         setContentView(R.layout.activity_main);
16         
17         sdMenu = (SlidingMenu) findViewById(R.id.menu);
18         btn = (Button) findViewById(R.id.btn);
19         btn.setOnClickListener(new OnClickListener() {
20             @Override
21             public void onClick(View v) {
22                 sdMenu.goLeft();
23             }
24         });
25     }
26 
27 }

4、SlidingMenu

 1 package com.zyhui.cehua;
 2 
 3 import android.content.Context;
 4 import android.util.AttributeSet;
 5 import android.util.DisplayMetrics;
 6 import android.view.Display;
 7 import android.view.MotionEvent;
 8 import android.view.ViewGroup;
 9 import android.view.WindowManager;
10 import android.widget.HorizontalScrollView;
11 import android.widget.LinearLayout;
12 
13 //HorizontalScrollView可以参考这个http://www.xuebuyuan.com/2162142.html地址
14 public class SlidingMenu extends HorizontalScrollView {
15     private ViewGroup mMenu;
16     private ViewGroup mMain;
17     private int mRightPadding = 0;
18     private int mScreenWidth;
19     private int mMenuWidth;
20     private float downX;
21     public SlidingMenu(Context context, AttributeSet attrs) {
22         super(context, attrs);
23         
24         WindowManager wm = (WindowManager) context.getSystemService(Context.WINDOW_SERVICE);
25         Display display = wm.getDefaultDisplay();
26         DisplayMetrics outMetrics = new DisplayMetrics();
27         display.getMetrics(outMetrics);
28         
29         //屏幕宽
30         mScreenWidth = outMetrics.widthPixels;
31     }
32     
33     //此方法是可以设置控件的宽高
34     @Override
35     protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
36         LinearLayout wrapper = (LinearLayout) getChildAt(0);
37         mMenu = (ViewGroup) wrapper.getChildAt(0);
38         mMain = (ViewGroup) wrapper.getChildAt(1);
39         
40         //菜单宽度
41         mMenuWidth = mScreenWidth - mRightPadding;
42         mMenu.getLayoutParams().width = mMenuWidth;//设置菜单宽度
43         
44         //主界面宽度
45         mMain.getLayoutParams().width = mScreenWidth;
46         
47         super.onMeasure(widthMeasureSpec, heightMeasureSpec);
48     }
49     
50     @Override
51     public boolean onTouchEvent(MotionEvent ev) {
52         switch(ev.getAction()){
53             case MotionEvent.ACTION_DOWN:
54                 downX = ev.getX();
55                 break;
56             case MotionEvent.ACTION_UP:
57                 int d = (int) (ev.getX() - downX);
58                 //往左
59                 if(d < 0){
60                     this.smoothScrollTo(mMenuWidth, 0);
61                 }else{//往右
62                     this.smoothScrollTo(0, 0);
63                 }
64                 break;
65             default:
66                 break;
67         }
68         return true;
69     }
70     
71     //决定视图的摆放位置
72     @Override
73     protected void onLayout(boolean changed, int l, int t, int r, int b) {
74         super.onLayout(changed, l, t, r, b);
75         this.scrollBy(mMenuWidth, 0);
76     }
77     
78     public void goLeft(){
79         this.smoothScrollTo(mMenuWidth, 0);
80     }
81 
82 }

 更加完善的效果可以参考此人博客:http://www.cnblogs.com/lichenwei/p/4111252.html?utm_source=tuicool&utm_medium=referral

侧滑UI

标签:

原文地址:http://www.cnblogs.com/zhongyinghe/p/5485027.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!