TextViews在RelativeLayout中的循环ProgressBar周围

时间:2017-03-06 04:23:42

标签: android xml android-layout user-interface relativelayout

我想在TextViews旁边有3个ProgressBar圆角形状!无论我尝试什么,我无法得到所有设备!我可以将保证金用于实现一个显示尺寸。但我需要在所有设备中都适合这一点。我使用dimen值来调整项目的内容。 Sample code或在我的source中进行修改对我非常有帮助!

我的目标:

enter image description here

我现在拥有什么

enter image description here

布局:

<RelativeLayout
                    android:id="@+id/progressSection"
                    android:layout_width="match_parent"
                    android:layout_height="match_parent"
                    android:layout_above="@+id/offers"
                    android:layout_below="@+id/validTill"
                    android:gravity="center">

                    <ProgressBar
                        android:id="@+id/circularProgressbar"
                        style="?android:attr/progressBarStyleHorizontal"
                        android:layout_width="@dimen/progressBarWidth"
                        android:layout_height="@dimen/progressBarHeight"
                        android:layout_centerInParent="true"
                        android:indeterminate="false"
                        android:max="100"
                        android:progress="75"
                        android:progressDrawable="@drawable/circular"
                        android:secondaryProgress="100" />


                    <ImageView
                        android:id="@+id/add"
                        android:layout_width="@dimen/sidebarIconHeight"
                        android:layout_height="@dimen/sidebarIconWidth"
                        android:layout_alignEnd="@+id/circularProgressbar"
                        android:layout_alignRight="@+id/circularProgressbar"
                        android:layout_alignTop="@+id/circularProgressbar"
                        android:layout_marginEnd="32dp"
                        android:layout_marginRight="32dp"
                        android:src="@drawable/red_plus" />

                    <RelativeLayout
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:layout_alignBottom="@+id/circularProgressbar"
                        android:layout_toLeftOf="@+id/circularProgressbar"
                        android:layout_toStartOf="@+id/circularProgressbar">

                        <TextView
                            android:id="@+id/data"
                            android:layout_width="@dimen/circularTextWidth"
                            android:layout_height="@dimen/circularTextHeight"
                            android:layout_centerHorizontal="true"
                            android:background="@drawable/circullar_text"
                            android:gravity="center"
                            android:text="Data"
                            android:textColor="@color/white"
                            android:textSize="@dimen/normalText" />

                        <TextView
                            android:id="@+id/min"
                            android:layout_width="@dimen/circularTextWidth"
                            android:layout_height="@dimen/circularTextHeight"
                            android:layout_below="@+id/data"
                            android:background="@drawable/circullar_text"
                            android:gravity="center"
                            android:text="Min"
                            android:textColor="@color/white"
                            android:textSize="@dimen/normalText" />

                        <TextView
                            android:id="@+id/sms"
                            android:layout_width="@dimen/circularTextWidth"
                            android:layout_height="@dimen/circularTextHeight"
                            android:layout_below="@+id/min"
                            android:background="@drawable/circullar_text"
                            android:gravity="center"
                            android:text="SMS"
                            android:textColor="@color/white"
                            android:textSize="@dimen/normalText" />
                    </RelativeLayout>
                </RelativeLayout>

ProgressBar:

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:id="@android:id/secondaryProgress">
        <shape
            android:innerRadiusRatio="3"
            android:shape="ring"
            android:thicknessRatio="14.0"
            android:useLevel="true">

            <gradient
                android:centerColor="#999999"
                android:endColor="#999999"
                android:startColor="#999999"
                android:type="sweep" />
        </shape>
    </item>
    <item android:id="@android:id/progress">
        <rotate
            android:fromDegrees="270"
            android:pivotX="50%"
            android:pivotY="50%"
            android:toDegrees="270">
            <shape
                android:innerRadiusRatio="3"
                android:shape="ring"
                android:thicknessRatio="14.0"
                android:useLevel="true">
                <rotate
                    android:fromDegrees="0"
                    android:pivotX="50%"
                    android:pivotY="50%"
                    android:toDegrees="360" />
                <gradient
                    android:centerColor="@color/colorRed"
                    android:endColor="@color/colorRed"
                    android:startColor="@color/colorRed"
                    android:type="sweep" />
            </shape>
        </rotate>
    </item>
</layer-list>

圆形TextView

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
    <solid android:color="#00ffffff" />

    <stroke
        android:width="1dp"
        android:color="#ffffff" />
    <corners
        android:bottomLeftRadius="40dp"
        android:bottomRightRadius="40dp"
        android:topLeftRadius="40dp"
        android:topRightRadius="40dp" />
    <size
        android:width="20dp"
        android:height="20dp" />
</shape>

dimen.xml

<resources>
    <!-- Default screen margins, per the Android Design guidelines. -->
    <dimen name="activity_horizontal_margin">16dp</dimen>
    <dimen name="activity_vertical_margin">16dp</dimen>
    <dimen name="footer_margin_bottom">10dp</dimen>
    <dimen name="footer_margin_top">10dp</dimen>
    <dimen name="margin_left">20dp</dimen>
    <dimen name="margin_right">20dp</dimen>
    <dimen name="normalText">14sp</dimen>
    <dimen name="largeText">16sp</dimen>
    <dimen name="smallText">10sp</dimen>
    <dimen name="sidebarIconMarginTop">10dp</dimen>
    <dimen name="sidebarIconWidth">40dp</dimen>
    <dimen name="sidebarIconHeight">40dp</dimen>
    <dimen name="balanceSectionHeight">100dp</dimen>
    <dimen name="progressBarWidth">200dp</dimen>
    <dimen name="progressBarHeight">200dp</dimen>
    <dimen name="circularTextWidth">50dp</dimen>
    <dimen name="circularTextHeight">50dp</dimen>
</resources>

0 个答案:

没有答案