作者: 牙叔
使用情景
模仿自动门打开的效果, 显示开门大吉
布局
-
DrawerLayout是安卓的侧滑菜单, 有两个侧滑菜单, 那么就是两扇门, 我好聪明
-
左右是侧滑菜单, 中间是内容区域
-
布局代码如下:
importClass(Packages.androidx.core.view.GravityCompat); ui.layout( <androidx.drawerlayout.widget.DrawerLayout id="drawer_layout" layout_width="match_parent" layout_height="match_parent" > {/* <!--内容区--> */} <LinearLayout id="view_content" layout_width="match_parent" layout_height="match_parent" gravity="center" orientation="vertical" > <text id="goodLuck" visibility="gone" text="开门大吉" textSize="66sp" gravity="center" w="*" textStyle="bold" textColor="#ff0000" ></text> <ImageView layout_width="100dp" layout_height="100dp" src="@drawable/ic_android_black_48dp" /> <Button id="btn_open" layout_width="wrap_content" layout_height="wrap_content" layout_marginTop="10dp" text="打开侧滑栏" /> </LinearLayout> {/* <!--左侧滑区--> */} <LinearLayout id="view_left" layout_width="200dp" layout_height="match_parent" layout_gravity="left" background="#3F51B5" gravity="center" orientation="vertical" > <Button id="btn_close" layout_width="wrap_content" layout_height="wrap_content" text="关闭所有侧滑栏" /> <Button id="btn_left_close" layout_width="wrap_content" layout_height="wrap_content" text="关闭当前侧滑栏" /> </LinearLayout> {/* <!--右侧滑区--> */} <LinearLayout id="view_right" layout_width="200dp" layout_height="match_parent" layout_gravity="right" background="#2196F3" gravity="center" orientation="vertical" > <Button id="btn_right_close" layout_width="wrap_content" layout_height="wrap_content" text="关闭当前侧滑栏" /> </LinearLayout> </androidx.drawerlayout.widget.DrawerLayout> );
按钮事件
- 侧滑菜单显示
drawerLayout.openDrawer(GravityCompat.START);
- 关闭侧滑菜单
drawerLayout.closeDrawer(GravityCompat.START);
- 关闭所有侧滑菜单
drawerLayout.closeDrawers();
-
开门大吉四个字
-
显示
ui.goodLuck.attr("visibility", "visible");
-
隐藏
ui.goodLuck.attr("visibility", "gone");
-
按钮事件代码如下
buttonIdList = ["btn_open", "btn_close", "btn_left_close", "btn_right_close"];
ui.post(function () {
buttonIdList.map(function (buttonId) {
ui[buttonId].click(function () {
setButtonClick(buttonId);
});
});
}, 100);
function setButtonClick(buttonId) {
let drawerLayout = ui.drawer_layout;
switch (buttonId) {
case "btn_open": //打开侧滑栏
log("btn_open");
drawerLayout.openDrawer(GravityCompat.START); //打开左边
drawerLayout.openDrawer(GravityCompat.END); //打开右边
break;
case "btn_close": //关闭所有侧滑栏
log("btn_close");
drawerLayout.closeDrawers();
ui.goodLuck.attr("visibility", "visible");
setTimeout(function () {
ui.goodLuck.attr("visibility", "gone");
}, 2000);
break;
case "btn_left_close": //关闭左侧
log("btn_left_close");
drawerLayout.closeDrawer(GravityCompat.START);
break;
case "btn_right_close": //关闭右侧
log("btn_right_close");
drawerLayout.closeDrawer(GravityCompat.END);
break;
}
}
QQ群
747748653
微信