我是开发商。我需要实现如下图所示的设计。我已经有功能的应用程序,但不知道如何平衡的办法呢?格外,我感兴趣的是如何显示的选项卡下的新建项目的数量。我知道该怎么做 - 是创造新的图标,红点,只是显示他们时,新的东西可
I'm developer. I need to implement design shown below. I already have functional app but wonder how to even approach this? Particulary, I'm interested in how to show Number of "New" items under tabs. What I KNOW how to do - is create new icons with red dots and just display them when new stuff available.
不过,我不知道如何使这些轮界浮在标题上面,里面显示号码。没有任何人有建议什么也找?样本?路线?
But I have no idea how to make those round circles float on top of title AND show number inside. Does anybody have suggestion on what too look for? Samples? Directions?
有关分离活动第二个问题。我应该控制相结合这样的按钮,只是夸大它的活动?否则,我可能会创建标签式的活动,但我不知道这是否是可能的样式它,使它看起来是这样的。
Second question about separating activities. Should I make control to combine buttons like this and just inflate it on activities? Otherwise I may create tabbed activity but I'm not sure if it's possible to style it to make it look like this.
请您徽章的TextView
,允许你通过调用数值设置为任何你喜欢的的setText()
。将的TextView
的背景为一个XML <形状>
绘制,使用它可以创建一个实体或渐变圆边框。一个XML绘制将扩展到适合的观点,因为它有更多或更少的文字调整大小。
Make your badge a TextView
, allowing you to set the numeric value to anything you like by calling setText()
. Set the background of the TextView
as an XML <shape>
drawable, with which you can create a solid or gradient circle with a border. An XML drawable will scale to fit the view as it resizes with more or less text.
RES /绘制/ badge_circle.xml:
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="oval">
<solid
android:color="#F00" />
<stroke
android:width="2dip"
android:color="#FFF" />
<padding
android:left="5dip"
android:right="5dip"
android:top="5dip"
android:bottom="5dip" />
</shape>
您得看看如何在椭圆/圆鳞大3-4位数字,虽然。如果这种效果是不理想的,尝试像下面的圆角矩形的方法。有了小的数字,该矩形仍然看起来像一个圆圈的半径一起收敛。
You'll have to take a look at how the oval/circle scales with large 3-4 digit numbers, though. If this effect is undesirable, try a rounded rectangle approach like below. With small numbers, the rectangle will still look like a circle as the radii converge together.
RES /绘制/ badge_circle.xml:
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<corners
android:radius="10dip"/>
<solid
android:color="#F00" />
<stroke
android:width="2dip"
android:color="#FFF" />
<padding
android:left="5dip"
android:right="5dip"
android:top="5dip"
android:bottom="5dip" />
</shape>
通过可扩展的背景下创建的,你可以将它添加到的背景的TextView
,像这样:
With the scalable background created, you simply add it to the background of a TextView
, like so:
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="10"
android:textColor="#FFF"
android:textSize="16sp"
android:textStyle="bold"
android:background="@drawable/badge_circle"/>
最后,这些的TextView
徽章可以放置在布局上的相应按钮/标签来识别。我会通过将每个按钮与其在一个 RelativeLayout的
集装箱徽章,像这样可能做到这一点:
Finally, these TextView
badges can be placed in your layout on top of the appropriate buttons/tabs. I would probably do this by grouping each button with its badge in a RelativeLayout
container, like so:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<Button
android:id="@+id/myButton"
android:layout_width="65dip"
android:layout_height="65dip"/>
<TextView
android:id="@+id/textOne"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignTop="@id/myButton"
android:layout_alignRight="@id/myButton"
android:text="10"
android:textColor="#FFF"
android:textSize="16sp"
android:textStyle="bold"
android:background="@drawable/badge_circle"/>
</RelativeLayout>
我希望这是足够的信息,至少让你指出正确的方向!
Hopefully that's enough information to at least get you pointed in the right direction!