【问题标题】:Best way to implement ui similar to web or "flat ui" on android在 android 上实现类似于 web 或“flat ui”的 ui 的最佳方式
【发布时间】:2016-02-19 09:18:46
【问题描述】:

Need to implement UI like in the following picture

最好的方法是什么?我发现了“材料设计”和PhoneGap。我是 android 开发的新手,所以我不知道最佳实践,我想选择最佳路径。我应该使用哪些确切的布局,RelativeLayout 或 TableLayout 或其他,如何将样式应用于 ui 元素、边框、背景等。

我应该使用样式还是内置属性?我可以在某处找到示例代码,可能是好的教程或开源应用程序吗?我在 Deitels 的一本书和 GitHub 中找到了很多示例,但它们看起来都像原生 android ui,而不像 web 或 flat ui。

【问题讨论】:

  • 根据要求我们推荐或查找工具、库或最喜欢的场外资源的问题,该帖子似乎与主题无关,因为它们往往会吸引自以为是的答案和垃圾邮件。请使用您最喜欢的搜索引擎来收集信息并在此处询问有关详细信息的问题。
  • 你好像迷路了。 Material Design 目前原生的 android UI。使用默认设置的 Android Studio 开发您的应用程序。它将具有 android 5.0+ 设备中的材料设计外观和感觉。如果您想在棒棒糖之前的设备中使用类似的 UI,请尽可能使用支持库。

标签: android flatui


【解决方案1】:

Flat Material UI 设计 Android:

据我了解,您希望 Android 原生 UI 的平面材料设计。

因此,请遵循以下流程:

让我们直接进入材料设计的两个关键特征: 主题和颜色!

主题让您可以为应用应用一致的基调,开发人员可以在深色或浅色主题之间进行选择(参见图 1 和图 2)。

还可以使用主题属性定义自定义颜色,然后应用程序会自动将这些属性用于不同的组件,例如用于状态栏的 colorPrimaryDark 和用于应用栏的 colorPrimary(参见下面的图 3)。

将Light主题添加到我们的应用程序中,并在res/values/styles.xml中自定义一些颜色 样式.xml

<resources>
    <!-- Base application theme. -->
    <style name="AppTheme.Base" parent="Theme.AppCompat.Light.NoActionBar">
        <!-- Customize your theme here. -->
        <item name="colorPrimary">#3F51B5</item>
        <!-- Light Indigo -->
        <item name="colorPrimaryDark">#3949AB</item>
        <!-- Dark Indigo -->
        <item name="colorAccent">#00B0FF</item>
        <!-- Blue -->
    </style>
    <style name="AppTheme" parent="AppTheme.Base"></style>
</resources>

应用现在应该如下所示:

更多信息请点击以下链接。

create an Android material design app

【讨论】:

  • 我需要相同的,但对于本机 android ui,而不是混合应用程序。 Web primiteves 像带边框和背景(纯色和渐变)的圆角矩形,相对定位。不像“使用标准布局和 ui 元素,它看起来像 android 5.0+ 中的平面 ui”,但我想自己设置边框、背景、颜色和字体。就像在 CSS 中一样。还是走错路了?
  • 我想你必须为android native搜索自定义物化主题......
  • 像这样我想github.com/eluleci/FlatUI 实现自定义视图来设置您的 ui 样式是否常见?
  • 请检查我更新的新答案。如果答案对您有帮助,请投票。
猜你喜欢
  • 1970-01-01
  • 2011-05-24
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2016-07-28
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多