Android开发进阶系列（四） 左移拉出Menu菜单界面布局

最新推荐文章于 2024-07-24 21:35:56 发布
最新推荐文章于 2024-07-24 21:35:56 发布
阅读量2.2k 收藏 1
点赞数 1
分类专栏： 移动应用开发 文章标签： android
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/sealeader/article/details/49997453
版权

08、09年的时候，我们在Symbian平台上开发了一款LBS的交友软件，对于Symbian平台的UI界面开发是颇为诟病的。Android的出现让人眼前一亮，当时还只是几个UI界面的Demo效果就已经让人大开眼界了。随着Android的爆发式增长，Android上开发的UI界面一个比一个炫。下面要介绍的Menu拉出式界面布局是在2013年做的一个APP，这种界面布局的特点是整洁有序，中规中矩。

APK下载地址：http://apk.hiapk.com/appinfo/com.lingling.guitachordplayer

链接里有截图，这里就不占用篇幅了。

Layout布局文件

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:orientation="vertical" >

    <LinearLayout
        android:id="@+id/layout_right"
        android:layout_width="wrap_content"
        android:layout_height="fill_parent"
        android:layout_marginLeft="50dp"
        android:orientation="vertical" >

        <AbsoluteLayout
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:background="@color/grey21"
            android:padding="6dp" >

            <TextView
                android:layout_width="50dp"
                android:layout_height="wrap_content"
                android:text="@string/settings"
                android:textColor="@android:color/background_light"
                android:textSize="16sp" />
        </AbsoluteLayout>

        <com.lingling.guitachordplayer.MyLinearLayout
            android:id="@+id/mylaout"
            android:layout_width="fill_parent"
            android:layout_height="fill_parent"
            android:layout_weight="1" >

            <ListView
                android:id="@+id/lv_set"
                android:layout_width="fill_parent"
                android:layout_height="fill_parent" >
            </ListView>
        </com.lingling.guitachordplayer.MyLinearLayout>
    </LinearLayout>

    <LinearLayout
        android:id="@+id/layout_left"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:background="@color/white"
        android:orientation="vertical" >

        <RelativeLayout
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:background="@drawable/side_nav_bg" >

            <ImageView
                android:id="@+id/iv_set"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_alignParentRight="true"
                android:layout_alignParentTop="true"
                android:clickable="true"
                android:src="@drawable/menuimage" />

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_centerInParent="true"
                android:text="@string/app_name"
                android:textColor="@android:color/background_light"
                android:textSize="20sp" />

            <ImageView
                android:id="@+id/iv_share"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_alignParentLeft="true"
                android:layout_alignParentTop="true"
                android:clickable="true"
                android:src="@drawable/share_btn" />
        </RelativeLayout>

        <com.lingling.guitachordplayer.MyLinearLayout
            android:id="@+id/favoritelaout"
            android:layout_width="fill_parent"
            android:layout_height="fill_parent"
            android:layout_weight="1" >

            <ListView
                android:id="@+id/lv_favorite"
                android:layout_width="fill_parent"
                android:layout_height="fill_parent" >
            </ListView>
        </com.lingling.guitachordplayer.MyLinearLayout>
    </LinearLayout>

</RelativeLayout>

这里其实把左右两个Layout都定义了。

View的初始化

    /***
     * 初始化view
     */
    void InitView() {
        layout_left = (LinearLayout) findViewById(R.id.layout_left);
        layout_right = (LinearLayout) findViewById(R.id.layout_right);
        iv_set = (ImageView) findViewById(R.id.iv_set);
        mylaout = (MyLinearLayout) findViewById(R.id.mylaout);
        favorlaout = (MyLinearLayout) findViewById(R.id.favoritelaout);
        lv_set.setAdapter(new ArrayAdapter<String>(this, R.layout.item,
                R.id.tv_item, title));
        lv_favor = (ListView) findViewById(R.id.lv_favorite);
        favorList = new ArrayList<Map<String, Object>>();

        /***
         * 实现该接口
         */
        mylaout.setOnScrollListener(new OnScrollListener() {
            @Override
            public void doScroll(float distanceX) {
                doScrolling(distanceX);
            }

            @Override
            public void doLoosen() {
                RelativeLayout.LayoutParams layoutParams = (RelativeLayout.LayoutParams) layout_left
                        .getLayoutParams();
                // 缩回去
                //if (layoutParams.leftMargin < -window_width / 2) {
                if (layoutParams.leftMargin == -MAX_WIDTH) {
                    // 点击，并未滑动，无需处理                 
                } else if (layoutParams.leftMargin < -window_width + 100) {
                    // 缩回去
                    new AsynMove().execute(-SPEED);
                } else {
                    // 滑动
                    new AsynMove().execute(SPEED);
                }
            }
        });
        //favorlaout
        favorlaout.setOnScrollListener(new OnScrollListener() {
            @Override
            public void doScroll(float distanceX) {
                doScrolling(distanceX);
            }

            @Override
            public void doLoosen() {
                RelativeLayout.LayoutParams layoutParams = (RelativeLayout.LayoutParams) layout_left
                        .getLayoutParams();
                // 缩回去
                //if (layoutParams.leftMargin < -window_width / 2) {
                if (layoutParams.leftMargin == 0) {
                    // 点击，并未滑动，无需处理                 
                } else if (layoutParams.leftMargin < -50) {
                    new AsynMove().execute(-SPEED);
                } else {
                    new AsynMove().execute(SPEED);
                }
            }
        });

        // 点击监听
        lv_set.setOnItemClickListener(this);
        lv_favor.setOnItemClickListener(this);

        layout_right.setOnTouchListener(this);
        layout_left.setOnTouchListener(this);
        iv_set.setOnTouchListener(this);
        mGestureDetector = new GestureDetector(this);
        // 禁用长按监听
        mGestureDetector.setIsLongpressEnabled(false);
        getMAX_WIDTH();

    }

    /***
     * 获取移动距离 移动的距离其实就是layout_left的宽度
     */
    void getMAX_WIDTH() {
        ViewTreeObserver viewTreeObserver = layout_left.getViewTreeObserver();
        // 获取控件宽度
        viewTreeObserver.addOnPreDrawListener(new OnPreDrawListener() {
            @Override
            public boolean onPreDraw() {
                if (!hasMeasured) {
                    window_width = getWindowManager().getDefaultDisplay()
                            .getWidth();
                    MAX_WIDTH = layout_right.getWidth();
                    RelativeLayout.LayoutParams layoutParams = (RelativeLayout.LayoutParams) layout_left
                            .getLayoutParams();
                    RelativeLayout.LayoutParams layoutParams_1 = (RelativeLayout.LayoutParams) layout_right
                            .getLayoutParams();
                    ViewGroup.LayoutParams layoutParams_2 = mylaout
                            .getLayoutParams();
                    // 注意： 设置layout_left的宽度。防止被在移动的时候控件被挤压
                    layoutParams.width = window_width;
                    layout_left.setLayoutParams(layoutParams);

                    // 设置layout_right的初始位置.
                    layoutParams_1.leftMargin = window_width;
                    layout_right.setLayoutParams(layoutParams_1);
                    // 注意：设置lv_set的宽度防止被在移动的时候控件被挤压
                    layoutParams_2.width = MAX_WIDTH;
                    mylaout.setLayoutParams(layoutParams_2);
                    hasMeasured = true;
                }
                return true;
            }
        });

    }

处理手势动作

    /***
     * listview 正在滑动时执行.
     */
    void doScrolling(float distanceX) {
        isScrolling = true;
        mScrollX += distanceX;// distanceX:向左为正，右为负

        RelativeLayout.LayoutParams layoutParams = (RelativeLayout.LayoutParams) layout_left
                .getLayoutParams();
        RelativeLayout.LayoutParams layoutParams_1 = (RelativeLayout.LayoutParams) layout_right
                .getLayoutParams();
        layoutParams.leftMargin -= mScrollX;
        layoutParams_1.leftMargin = window_width + layoutParams.leftMargin;
        if (layoutParams.leftMargin >= 0) {
            isScrolling = false;// 拖过头了不需要再执行AsynMove了
            layoutParams.leftMargin = 0;
            layoutParams_1.leftMargin = window_width;

        } else if (layoutParams.leftMargin <= -MAX_WIDTH) {
            // 拖过头了不需要再执行AsynMove了
            isScrolling = false;
            layoutParams.leftMargin = -MAX_WIDTH;
            layoutParams_1.leftMargin = window_width - MAX_WIDTH;
        }

        layout_left.setLayoutParams(layoutParams);
        layout_right.setLayoutParams(layoutParams_1);
    }

处理点击事件

    /*
     * 滑动监听 就是一个点移动到另外一个点. distanceX=后面点x-前面点x，如果大于0，说明后面点在前面点的右边及向右滑动
     */
    @Override
    public boolean onScroll(MotionEvent e1, MotionEvent e2, float distanceX,
            float distanceY) {
        // 执行滑动.
        doScrolling(distanceX);
        return false;
    }

    @Override
    public void onLongPress(MotionEvent e) {

    }

    @Override
    public boolean onFling(MotionEvent e1, MotionEvent e2, float velocityX,
            float velocityY) {
        return false;
    }

    @Override
    public boolean onKeyDown(int keyCode, KeyEvent event) {
        if (keyCode == KeyEvent.KEYCODE_BACK && event.getRepeatCount() == 0) {
            RelativeLayout.LayoutParams layoutParams = (RelativeLayout.LayoutParams) layout_left
                    .getLayoutParams();
            if (layoutParams.leftMargin < 0) {
                new AsynMove().execute(SPEED);
                return false;
            }
            else {
                // Popup window
                showExitGameAlert();
            }
        }

        if (keyCode == KeyEvent.KEYCODE_MENU && event.getRepeatCount() == 0) {
            RelativeLayout.LayoutParams layoutParams = (RelativeLayout.LayoutParams) layout_left
                    .getLayoutParams();
            if (layoutParams.leftMargin < 0) {
                new AsynMove().execute(SPEED);
                return false;
            }
            else {
                new AsynMove().execute(-SPEED);
                return false;
            }
        }
        return super.onKeyDown(keyCode, event);
    }

    @Override
    public boolean onTouch(View v, MotionEvent event) {

        view = v;// 记录点击的控件

        // 松开的时候要判断，如果不到半屏幕位子则缩回去，
        if (MotionEvent.ACTION_UP == event.getAction() && isScrolling == true) {
            RelativeLayout.LayoutParams layoutParams = (RelativeLayout.LayoutParams) layout_left
                    .getLayoutParams();
            // 缩回去 // 拉动50px就认为是拉动而不是点击
            //if (layoutParams.leftMargin < -window_width / 2) {
            if (layoutParams.leftMargin < -50) {
                new AsynMove().execute(-SPEED);
            } else {
                new AsynMove().execute(SPEED);
            }
        }

        return mGestureDetector.onTouchEvent(event);
    }

    @Override
    public boolean onDown(MotionEvent e) {

        int position = lv_set.pointToPosition((int) e.getX(), (int) e.getY());
        if (position != ListView.INVALID_POSITION) {
            View child = lv_set.getChildAt(position
                    - lv_set.getFirstVisiblePosition());
            if (child != null)
                child.setPressed(true);
        }

        mScrollX = 0;
        isScrolling = false;
        // 将之改为true，才会传递给onSingleTapUp,不然事件不会向下传递.
        return true;
    }

    @Override
    public void onShowPress(MotionEvent e) {

    }

    /***
     * 点击松开执行
     */
    @Override
    public boolean onSingleTapUp(MotionEvent e) {
        // 点击的不是layout_left
        if (view != null && view == iv_set) {
            RelativeLayout.LayoutParams layoutParams = (RelativeLayout.LayoutParams) layout_left
                    .getLayoutParams();
            // 左移动
            if (layoutParams.leftMargin >= 0) {
                new AsynMove().execute(-SPEED);
                lv_set.setSelection(0);// 设置为首位.
            } else {
                // 右移动
                new AsynMove().execute(SPEED);
            } 
        } else if (view != null && view == iv_share) {
            if(!FusionField.isUnlocked) {
                // 弹出激活对话框
                final ActivateCodeDialog.Builder builder2 = new ActivateCodeDialog.Builder(MainActivity.this,FusionField.deviceID);
                builder2.setPositiveButtonListener(new DialogInterface.OnClickListener() {
                    public void onClick(DialogInterface dialog, int which) {
                        String code = builder2.getCode();
                        if(code.equals(FusionField.getMD5(FusionField.deviceID))) {
                            FusionField.isUnlocked=true;
                            FusionField.editor.putBoolean("Unlocked", true);
                            FusionField.editor.commit();
                            Toast toast = Toast.makeText(getApplicationContext(),"激活成功！", Toast.LENGTH_SHORT);
                            toast.setGravity(Gravity.CENTER, 0, 0); 
                            toast.show();
                            dialog.dismiss();
                        } else {
                            Toast toast = Toast.makeText(getApplicationContext(),"激活失败！", Toast.LENGTH_SHORT);
                            toast.setGravity(Gravity.CENTER, 0, 0); 
                            toast.show();
                        }
                    }
                });
                builder2.create().show();
            } else {
                // 分享
                captureScreen();
                Intent intent = new Intent(Intent.ACTION_SEND);
                intent.addFlags(Intent.FLAG_ACTIVITY_NEW_TASK);
                intent.setType("image/png");
                intent.putExtra(Intent.EXTRA_TITLE,getString(R.string.app_name));
                intent.putExtra(Intent.EXTRA_STREAM,Uri.parse(FusionField.sharedFileName));    
                startActivity(Intent.createChooser(intent, "分享方式"));
            }
        } else if (view != null && view == layout_left) {
            RelativeLayout.LayoutParams layoutParams = (android.widget.RelativeLayout.LayoutParams) layout_left
                    .getLayoutParams();
            if (layoutParams.leftMargin < 0) {
                // 说明layout_left处于移动最左端状态，这个时候如果点击layout_left应该直接所以原有状态.(更人性化)
                // 右移动
                new AsynMove().execute(SPEED);
            }
        }

        return true;
    }
日西月东
关注
  • 1
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
Android开发进阶系列（五） 连接服务器下载文件或资源
日西月东的专栏
11-24 3091
连接服务器更新APK 下载资源文件
51单片机开发板实验：用P0显示左移运算结果程序源代码.rar
02-24
1. **51单片机**：51系列单片机是由Intel公司推出的8位微处理器，因其强大的通用性和易用性，被广泛应用于嵌入式系统设计。它们包含中央处理单元（CPU）、存储器、定时器/计数器、输入/输出（I/O）接口等组件。 2. ...
Android开发进阶系列（二） Tab页界面布局
日西月东的专栏
11-23 3442
Android ViewPager 左右滑动
Android开发进阶系列（八） 界面美化之自定义弹出框
日西月东的专栏
11-24 1832
Android dialog 自定义
Android开发进阶系列（六） ListView的基本用法
日西月东的专栏
11-24 1189
ListView Adapter
Android开发进阶系列（七） 使用数据库
日西月东的专栏
11-24 1246
Android 数据库
Android开发进阶系列（三） 系统参数的获取和Broadcast
日西月东的专栏
11-23 3164
手机系统参数 WiFi状态 broadcast
Android开发进阶系列（一） 序言
日西月东的专栏
11-23 883
从2010年接触Android到现在已经5年了，时间虽然长，但主要还是业余时间在弄。一开始边学边用自己设计开发些小工具小软件，觉得挺有意思的，于是继续想idea，继续做。期间也尝试过小游戏，后来还把其中一个加入了网游的形式，支持在线PK和金币系统。再后来给公司的一个BS项目做了扩展，上了第一个企业级APP应用。一路过来，还是觉得大有收获的。因此整理了下写过的代码，专门开辟一个系列，来分享一下Andr
Android开发进阶系列（十） 玩转AChartEngine专题（下）
日西月东的专栏
11-27 2181
第二个项目是电力数据实时监测相关的，数据就不是从本机上读取了，而是连接到服务器与后台数据库交互。下面是三个界面对应的三种不同的显示需求：1. 实时往前推的柱状图初始化代码： //画曲线 private View InitRenderer() { /* achartengine-1.1.0 * */ //
Android开发进阶系列（九） 玩转AChartEngine专题（上）
日西月东的专栏
11-27 1381
AChartEngine（简称ACE）是Google的一个开源图表库（for Android）。它功能强大，支持散点图、折线图、饼图、气泡图、柱状图、短棒图、仪表图等多种图表。就像Web开发世界里许多功能强大的图表库一样，它也提供比较灵活的配置。笔者将分享两个项目中对AChartEngine的使用代码，由简单到复杂。最初接触AChartEngine是2013年利用业余时间开发一个网络信号监测APP的
10-LED循环左移.zip_51单片机_单片机开发led
09-20
本项目“10-LED循环左移.zip”是针对51单片机的LED显示控制程序，特别适合初学者进行单片机开发实践。 LED（Light Emitting Diode）是一种半导体发光二极管，常用于设备指示、显示屏等场合。在单片机控制下，LED...
为什么I2C从机地址要左移一位
08-04
在I2C通信协议中，从机地址左移一位是一个重要的细节，对于初学者来说可能会感到困惑。I2C（Inter-Integrated Circuit）是一种多主机、串行、两线制总线，常用于微控制器（MCU）与各种外部设备如传感器、存储器等...
一款基于Android平台益智游戏的设计与实现.pdf
09-22
该游戏是在Android应用平台上开发的，使用的开发语言为Java语言，开发工具为Eclipse，并包含ADT等插件。 系统设计 图1系统流程图 在对游戏进行详细需求分析的基础上，确定了系统的功能和性能要求，对游戏的主界面...
流水灯左移8个灯亮然后右移至8个灯亮，再循环
08-21
流水灯左移右移实现循环移动 本文将详细介绍流水灯左移右移实现循环移动的知识点，该实验使用了51单片机，实现了流水灯由右向左然后由左向右循环移动的功能。 一、宏定义 宏定义是C语言中的一个预处理命令，用于...
从Eclipse转到Android Studio的注意事项
日西月东的专栏
01-12 1686
从Eclipse转到Android Studio的注意事项13年的时候做了几个Android应用，后来偶尔更新过两次，就一直放在各大安卓市场，平均每天大致有个十几块的收入。前一阵想起来收钱，就看了下，发现现在下载量回落得太厉害，收入也降到只有5块左右。看了看应用市场里的评价，大致是因为APP内的付费资源的下载链接总是出状况。这可能是因为我放置资源的服务器不稳定，同时，我也花了点时间看了好几款同品类的
Android Webview 使用实例
日西月东的专栏
01-14 978
一星期前做了一个手机端的内容型网站，本来是用来跟我的微信订阅号捆绑的，为订阅号提供内容和交互服务。但在找到合适的切入点之前，办这个微信订阅号只是想体验一下整个流程，亲身弄一遍下来肯定会对甄选项目有帮助。但既然微站有了，里面内容也有了些，那正好做一个Android APP，这样即使在微信订阅号的入口上做了限制，也可以从APP访问全站内容。 下面是主要代码、效果图和源码工程下载。 主要代码 webVie
47、PHP实现机器人的运动范围
weixin_44010641的博客
07-24 819
地上有一个m行和n列的方格。一个机器人从坐标0,0的格子开始移动，每一次只能向左，右，上，下四个方向移动一格，但是不能进入行坐标和列坐标的数位之和大于k的格子。但是，它不能进入方格（35,38），因为3+5+3+8 = 19。请问该机器人能够达到多少个格子？当k为18时，机器人能够进入方格（35,37），因为3+5+3+7 = 18。
【Android】广播机制
最新发布
2301_79977698的博客
07-24 776
在Android中，广播（Broadcast）是一种消息，任何应用程序都可以发送广播消息，任何应用程序也都可以接收广播消息。广播通常用于通知应用程序某些事件的发生，比如系统启动、电量低、网络状态改变等。Broadcast Receiver（广播接收器）：用于接收广播消息并响应这些消息的组件。Intent（意图）：用于传递广播消息的数据结构。标准广播（Normal Broadcast）是完全异步的，所有接收器几乎同时接收广播，并且接收顺序是不确定的。
不用CSS怎么将pywebio网格布局后的界面集体左移
07-08
如果你不想使用 CSS，可以通过调整网格布局的 HTML 代码来实现将 PyWebIO 网格布局后的界面集体左移。以下是一种方法： 1. 在应用中导入 `put_html` 函数： ```python from pywebio import put_html from pywebio....
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值