Android中SlidingDrawer利用透明动画提示效果
【摘要】 本文介绍了在Android中使用`SlidingDrawer`实现带有透明动画提示效果的方法。通过XML布局配置`SlidingDrawer`的把手(handle)和内容(content),结合Activity中的代码实现动态动画效果。最终实现了交互性强、视觉效果良好的滑动抽屉功能。
Android中SlidingDrawer利用透明动画提示效果
效果图如下:
SlidingDrawer在xml布局中的使用:
android:handle="" ------->把手
android:content=""------->内容
本Demo布局代码(drawer_bg为那张大的图片,drawer_arrow_up为向上的箭头图片,drawer_arrow_down为向下的箭头图片)
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
tools:context=".activity.MyDemo">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"></RelativeLayout>
<SlidingDrawer
android:layout_weight="1"
android:id="@+id/demo_sd"
android:layout_width="match_parent"
android:layout_height="0dp"
android:handle="@id/demo_ll_handle"
android:content="@id/demo_ll_content"
>
<!--抽屉的把手-->
<LinearLayout
android:id="@+id/demo_ll_handle"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:gravity="center"
android:background="@mipmap/drawer_bg">
<ImageView
android:id="@+id/demo_lv_up1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@mipmap/drawer_arrow_up"/>
<ImageView
android:id="@+id/demo_lv_up2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@mipmap/drawer_arrow_up"/>
</LinearLayout>
<!--抽屉的内容-->
<RelativeLayout
android:background="#ffffff"
android:id="@+id/demo_ll_content"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<TextView
android:layout_centerInParent="true"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="26sp"
android:text="抽屉的内容"/>
</RelativeLayout>
</SlidingDrawer>
<Button
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="我是打酱油的"
android:background="#ff00ff"
/>
</LinearLayout>
Activity中的实现效果的代码:(透明动画)
Activity代码如下:
public class MyDemo extends AppCompatActivity {
private ImageView demo_lv_up1;
private ImageView demo_lv_up2;
private LinearLayout demo_ll_handle;
private RelativeLayout demo_ll_content;
private SlidingDrawer demo_sd;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_my_demo);
initView();
//动画的实现
initAnimation();
//抽屉的点击事件
setOnDrawerListener();
}
private void initView() {
demo_lv_up1 = (ImageView) findViewById(R.id.demo_lv_up1);
demo_lv_up2 = (ImageView) findViewById(R.id.demo_lv_up2);
demo_ll_handle = (LinearLayout) findViewById(R.id.demo_ll_handle);
demo_ll_content = (RelativeLayout) findViewById(R.id.demo_ll_content);
demo_sd = (SlidingDrawer) findViewById(R.id.demo_sd);
}
//动画的实现
private void initAnimation() {
demo_lv_up1.setImageResource(R.mipmap.drawer_arrow_up);
demo_lv_up2.setImageResource(R.mipmap.drawer_arrow_up);
//半透明-不透明
AlphaAnimation animation = new AlphaAnimation(0.2f, 1.0f);
animation.setDuration(500);
animation.setRepeatCount(Animation.INFINITE);
animation.setRepeatMode(Animation.REVERSE);
demo_lv_up1.startAnimation(animation);
//不透明-半透明
AlphaAnimation animation1 = new AlphaAnimation(1.0f, 0.2f);
animation1.setDuration(500);
animation1.setRepeatCount(Animation.INFINITE);
animation1.setRepeatMode(Animation.REVERSE);
demo_lv_up2.startAnimation(animation1);
}
//抽屉的点击事件
private void setOnDrawerListener() {
//打开抽屉
demo_sd.setOnDrawerOpenListener(new SlidingDrawer.OnDrawerOpenListener() {
@Override
public void onDrawerOpened() {
//关闭动画,改变箭头方向
closeAnimation();
}
});
demo_sd.setOnDrawerCloseListener(new SlidingDrawer.OnDrawerCloseListener() {
@Override
public void onDrawerClosed() {
//改变箭头方向,开启动画
initAnimation();
}
});
}
//关闭动画且改变箭头方向
private void closeAnimation() {
demo_lv_up1.clearAnimation();
demo_lv_up2.clearAnimation();
//改变箭头方向
demo_lv_up1.setImageResource(R.mipmap.drawer_arrow_down);
demo_lv_up2.setImageResource(R.mipmap.drawer_arrow_down);
}
}
【声明】本内容来自华为云开发者社区博主,不代表华为云及华为云开发者社区的观点和立场。转载时必须标注文章的来源(华为云社区)、文章链接、文章作者等基本信息,否则作者和本社区有权追究责任。如果您发现本社区中有涉嫌抄袭的内容,欢迎发送邮件进行举报,并提供相关证据,一经查实,本社区将立刻删除涉嫌侵权内容,举报邮箱:
cloudbbs@huaweicloud.com
- 点赞
- 收藏
- 关注作者
评论(0)