在 Android 上 "emulate" FloatingActionButton 的最佳方式？（加速器钛）

Question

截至今天，Appcelerator Titanium 上还没有对 FloatingActionButton 的原生支持，所以我想知道哪种是最好的模拟方式。

我想创建一个像这样的 FloatingActionButton：

我尝试了不同的方法，但 none 似乎 100% 准确。

我看到 GitHub 上有几个模块，但其中一个不接受图标或者至少我不知道如何使用它们 (https://github.com/k0sukey/be.k0suke.tifab) and the other one requires me to enable Hyperloop and disable LiveView (https://github.com/appcelerator-forks/loop-modules.Ti.FAB)，这会减慢编译时间，从而让我浪费很多时间。

我也尝试创建一个带有 ImageView 的圆形视图，但它没有正确显示，背景颜色没有覆盖所有视图：

我的代码如下所示：

XML:

<View id="locateView">
    <ImageView id="locateUser" touchEnabled="false" />
</View>

JS:

// This is half of 32dp
Alloy.Globals.borderRadiusFAB = ( parseInt("32dp") * (Titanium.Platform.displayCaps.dpi / 160));

TSS：

"#locateView" : {
    bottom: "12dp",
    right: "12dp",
    height: "48dp",
    width: "48dp",
    borderRadius : Alloy.Globals.borderRadiusFAB,
    backgroundColor: '#80FFFFFF',
    touchFeedback: true,
    touchFeedbackColor: "#808080",
    elevation: 10
}

"#locateUser" : {
    height: "32dp",
    width: "32dp",
    image : "/icons/my_location.png"
}

我正在使用 Titanium SDK 6.2.0。

Answer 1

我认为唯一的问题是使用似乎有一些背景颜色的 ImageView。有多种创建此按钮的方法，但这里是一个示例应用程序，它创建了几乎 99% 相似的 FAB 按钮。

https://drive.google.com/file/d/0B4ZdsEjK2ySIMXd1YS15ZTk1TDg/view?usp=sharing

它包含一个示例源代码，说明如何使用单一代码库为 iOS 和 Android 创建更好的 FAB 按钮。它还包含一个 Material 字体文件，该文件展示了如何使用字体创建矢量 image/icons 而不是 ImageView。

这里是 link 阅读更多关于使用 Labels 代替 ImageView.

https://medium.com/all-titanium/cool-technique-to-use-vector-icons-using-iconic-font-files-aab4513aa8da

此示例代码将创建如下图标：

在 Android 上 "emulate" FloatingActionButton 的最佳方式？（加速器钛）

Best way to "emulate" a FloatingActionButton on Android? (Appcelerator Titanium)

android

titanium

appcelerator

在 Android 上 "emulate" FloatingActionButton 的最佳方式？ （加速器钛）

Best way to "emulate" a FloatingActionButton on Android? (Appcelerator Titanium)

android

titanium

appcelerator

在 Android 上 "emulate" FloatingActionButton 的最佳方式？（加速器钛）