Android - iphone 风格 tabhost

发布于 2024-08-29 23:15:51 字数 413 浏览 3 评论 0原文

是否可以将 Android Tabhost 设计得像 iPhone 一样? 如果没有,是否有任何开源代码可以展示如何为 Android 创建底部选项卡?

替代文本
(来源:appshopper.com
替代文本

Is it possible to style the Android Tabhost to look like that of the iPhone?
If not, is there any open source code that can show how to create Bottom Tabs for Android ?

alt text
(source: appshopper.com)
alt text

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(4

我的奇迹 2024-09-05 23:15:51

我建议你们不要改变选项卡的默认外观和感觉,因为Android设备上的用户有自己的用户体验,你会否定过去的体验,所以不要强迫他们学习新的选项卡体验(因为用户使用移动设备的人很懒于学习新事物,通常他们依赖于过去的经验。)

请参阅 纯 Android 了解更多。

不过,如果您想继续,我已将默认的 Android 选项卡自定义为看起来像 iPhone 选项卡。
它很简单,并且具有默认的 Android 选项卡的 ui 组件(̶T̶a̶b̶H̶o̶s̶t̶̶T̶a̶b̶W̶i̶d̶g̶e̶t̶)。

下载链接:
GitHub、Iphone-Tab-in-Android

此示例已升级为使用TabLayoutViewPager

相关博客条目可在此处找到:

Android 中类似 iPhone 的选项卡。

屏幕截图:

底部屏幕截图中的选项卡

我还对选项卡主机进行了自定义,使其看起来像凸起的中心选项卡。

Raished Center Screenshot

要下载 RaiseCenterTab,请转到此处GitHub:RaishedCenterTab

I would suggest you guys to not change the default look and feel of the tabs, because users on android devices have their own user experience, and you will negate that past experience, so don't force them to learn new tabs experience (because users on mobile are so lazy to learn new things, usually they rely on their past experience.)

See Pure Android for more.

However if you want to go ahead, I've customized the default Android Tabs to be look like iPhone tabs.
Which is simple and features default Android tabs' ui components (̶T̶a̶b̶H̶o̶s̶t̶, ̶T̶a̶b̶W̶i̶d̶g̶e̶t̶).

Download link:
GitHub, Iphone-Tab-in-Android

This sample has been upgraded to use TabLayout and ViewPager

Relavent Blog entry can be found here:

iPhone like Tabs in Android.

The screenshot:

tabs at bottom screenshot

I have also cutomized the tabhost to look like Raised Center Tab.

Raised Center Screenshot

to download RaiseCenterTab, please go here GitHub: RaisedCenterTab.

赠意 2024-09-05 23:15:51

您需要自己构建此控件。
几个选项:

  • 使用 RadioGroup 并放置
    那里有自定义单选按钮和
    自定义它的地狱。

  • 从头开始构建此控件,从其中之一继承它
    布局(框架、相对、线性)
    并构建您需要的行为。

  • 您还可以获取 TabHost src,并将其用作控件的基础

You'll need to build this control yourself.
Few options:

  • use RadioGroup and put
    custom radio buttons there and
    customize hell of it.

  • build this control from scratch, inherit it from one of the
    layouts ( Frame, Relative, Linear )
    and build the behavior you need.

  • You can also take TabHost src, and use it as a base for your control

記柔刀 2024-09-05 23:15:51

你可以看一下: https://github.com/mta452/iTab

这样做的好处是它会像 iOS 一样自动使用渐变进行图像整形。

屏幕截图:

iTab 屏幕截图

You can look at: https://github.com/mta452/iTab

The plus point of this is that it automatically does images shaping with gradient like iOS does.

Screenshot:

Screenshot of iTab

絕版丫頭 2024-09-05 23:15:51

你的截图是android 1.6。风格。如果您在较新版本上使用 tabhost,只需将其放在屏幕底部,它看起来会非常像 iPhone 版本。

我不会对 Android 的 UI 做太多改变,只是让它与 iphone 的外观和感觉(相同的图标)相似,并保持 Android 风格的其余部分。这将使该应用程序对用户来说看起来很熟悉。

要实现相同的图标外观,只需使用可绘制的 xml 定义以及按钮的选定和未选定状态,就像在 iphone 上一样。要设置图标,请使用 tabspec 的 setIndicator 方法。

您可以通过设置选项卡小部件的背景或样式来对选项卡主机进行某种样式设置。但小部件的实际内部部分将绘制在您的样式和背景上方

Your screenshot has the android 1.6. style. If you are using a tabhost on a newer version and simply put it on the bottom of the screen it will look very much like the iphone version.

I wouldn't change to much at the UI of android simply give it a resemblance to the iphone look and feel(same icons) and stay with the rest in the android style. This will make the app look familiar to the users.

To achieve the same look for the icons just use an xml definition of you drawable with a selected and a not selected state of the button like it looks on the iphone. To set an icon use the setIndicator method of the tabspec.

You can somewhat style the tabhost by setting a background or a style for the tabwidget. But the actual inner part of the widget will be drawn above you style and background

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文