前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >AndroidSlidingUpPanel 使用控制和简单的分析方法

AndroidSlidingUpPanel 使用控制和简单的分析方法

作者头像
全栈程序员站长
发布2022-07-06 11:35:38
8700
发布2022-07-06 11:35:38
举报
文章被收录于专栏:全栈程序员必看

大家好,又见面了,我是全栈君。

滑 – 向上的时间可以飞起来控件的显示区域。分类似至play music有效。

AndroidSlidingUpPanel 使用控制和简单的分析方法
AndroidSlidingUpPanel 使用控制和简单的分析方法

该控件在主界面中有一个例如以下图红色箭头所指的底部触发区域

AndroidSlidingUpPanel 使用控制和简单的分析方法
AndroidSlidingUpPanel 使用控制和简单的分析方法

该区域点击的时候被隐藏在下方的内容将网上漂移到顶部,直到被隐藏的内容全然挡住原来的布局。可是这个触发区域仍然存在,如图。

AndroidSlidingUpPanel 使用控制和简单的分析方法
AndroidSlidingUpPanel 使用控制和简单的分析方法

当被隐藏区域全然显示。这时再次点击触发区域(或者是通过下滑的手势)将恢复到最初的状态。

一般再未点击的时候。这个触发区域显示一些被隐藏内容的简要信息。

这就是AndroidSlidingUpPanel的效果了。

AndroidSlidingUpPanel的实现是使用ViewdragHelper实现的。事实上ViewdragHelper在surport v4中已经能够直接使用了。可是作者直接将ViewdragHelper的全部源代码放到了自己的项目中。

以下是AndroidSlidingUpPanel库的代码结构:

AndroidSlidingUpPanel 使用控制和简单的分析方法
AndroidSlidingUpPanel 使用控制和简单的分析方法

当中SlidingUpPanelLayout是一个继承自ViewGroup的类。

用法:

.将com.sothree.slidinguppanel.SlidingUpPanelLayout作为根节点放到你activity的layout文件里。

.layout必须设置gravity属性为top 或者bottom

.确保SlidingUpPanelLayout有两个子view,一个是主界面。另外一个是向上滑动的界面。

.SlidingUpPanelLayout的width须要设置成match_parent,height能够是match_parent或者是固定值。

.默认情况下。整个界面都能够对应滑动和点击事件。你能够通过调用setDragView来约束可滑动的View范围。

很多其它的使用请參考demo。

代码语言:javascript
复制
<com.sothree.slidinguppanel.SlidingUpPanelLayout
    xmlns:sothree="http://schemas.android.com/apk/res-auto"
    android:id="@+id/sliding_layout"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:gravity="bottom"
    sothree:panelHeight="68dp"
    sothree:shadowHeight="4dp">
    <TextView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:gravity="center"
        android:text="Main Content"
        android:textSize="16sp" />
    <TextView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:gravity="center|top"
        android:text="The Awesome Sliding Up Panel"
        android:textSize="16sp" />
</com.sothree.slidinguppanel.SlidingUpPanelLayout>

项目给出的demo中当向上滑动的时候actionbar也是跟着慢慢隐藏的。这样的效果必须使用 ActionBarOverlay模式:

代码语言:javascript
复制
<style name="AppTheme">
    <item name="android:windowActionBarOverlay">true</item>
</style>

同一时候这样的情况你须要为主区域的布局设置margintop为actionbar的高度:

代码语言:javascript
复制
?android:attr/actionBarSize

还须要在代码中动态的改变actionbar:

代码语言:javascript
复制
public void setActionBarTranslation(float y) {
    // Figure out the actionbar height
    int actionBarHeight = getActionBarHeight();
    // A hack to add the translation to the action bar
    ViewGroup content = ((ViewGroup) findViewById(android.R.id.content).getParent());
    int children = content.getChildCount();
    for (int i = 0; i < children; i++) {
        View child = content.getChildAt(i);
        if (child.getId() != android.R.id.content) {
            if (y <= -actionBarHeight) {
                child.setVisibility(View.GONE);
            } else {
                child.setVisibility(View.VISIBLE);
                if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.HONEYCOMB) {
                    child.setTranslationY(y);
                } else {
                    AnimatorProxy.wrap(child).setTranslationY(y);
                }
            }
        }
    }
}

最后要说的是,AndroidSlidingUpPanel在某些方面有点类似与垂直的ViewPager。可是不同点也非常多。假设你想用ViewPager来实现AndroidSlidingUpPanel的效果是非常不明智的。

项目地址:

https://github.com/umano/AndroidSlidingUpPanel

版权声明:本文博主原创文章,博客,未经同意,不得转载。

发布者:全栈程序员栈长,转载请注明出处:https://javaforall.cn/117127.html原文链接:https://javaforall.cn

本文参与 腾讯云自媒体同步曝光计划,分享自作者个人站点/博客。
原始发表:2022年1月1,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体同步曝光计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档