如何在 appcelerator 中隐藏幻灯片菜单？答案

【问题标题】：How can I hide slide menu in appcelerator?如何在 appcelerator 中隐藏幻灯片菜单？
【发布时间】：2016-11-09 08:14:11
【问题描述】：

我正在使用 appcelerator 构建一个应用程序。我还在构建一个自定义幻灯片菜单。所以如果你点击按钮，滑动菜单会从左到右出现。

今天晚些时候，我有这个固定宽度的菜单。为了隐藏这个菜单，我在 -width 处设置了一个属性。

现在我想用百分比设置菜单的宽度。但我不知道如何隐藏菜单。

这是我的 css 文件：

"#main_menu": {
    layout: "vertical",
    scrollType: "vertical",
    showVerticalScrollIndicator: true,
    top: 0,
    left: 0,
    width: "55%",
    height: Ti.UI.FILL,
    backgroundColor: "#70C662",
}

这是我的 js 文件

var menu_width = (Ti.Platform.displayCaps.platformWidth/2);
main_menu = Alloy.createController("_main_menu", args).getView();
$.sidebar.left = -menu_width;

但是menu_width的大小不正确，因为他的值是180，而且我的智能手机不可能有360px的尺寸。

【问题讨论】：

标签： javascript android css appcelerator-titanium appcelerator-studio

【解决方案1】：

如果您的菜单视图的宽度设置为 55%，则需要存储该百分比的 dp 版本。

"#main_menu": {
    width: "55%"
}

设备宽度：

var width = Ti.Platform.displayCaps.platformWidth;
//update this on orientation change

隐藏菜单：

$.main_menu.left = show ? 0 : -parseInt(width * 0.55));

如果设备宽度为360，则菜单宽度为198，隐藏时左侧值为-198

不要忘记更新方向变化的值。

【讨论】：