web-dev-qa-db-ja.com

Android ProgressBarUIカスタムレイアウト

次の画像のようにステータスバーをカスタマイズしようとしています。enter image description here

ただし、数時間後、必要なのは背景のステータスバーだけです(画像2)。 enter image description here

私が持っている現在のコードは次のとおりです。xmlレイアウト:

<ProgressBar
                Android:id="@+id/pBarOverallStatus"
                style="?android:attr/progressBarStyleHorizontal"
                Android:layout_width="0dip"
                Android:layout_height="fill_parent"
                Android:layout_marginLeft="10dip"
                Android:layout_marginRight="10dip"
                Android:layout_weight="94"
                Android:indeterminateOnly="false"
                Android:max="100"
                Android:progressDrawable="@drawable/progress_bar_states" >
            </ProgressBar>

Progress_bar_states.xml:

<layer-list xmlns:Android="http://schemas.Android.com/apk/res/Android" >

    <!-- <item Android:id="@Android:id/progress">
        <bitmap
            Android:gravity="center"
            Android:src="@drawable/progressbar_progressing" />

        <corners Android:radius="10dp" />
    </item>
     -->

</layer-list>

コメントを削除します。proressbar_progressingは次のようになります。 enter image description here コーナーがないので少し醜いです。 enter image description here

次のようなコードから背景を追加しています。

overallStatus = (ProgressBar) findViewById(R.id.pBarOverallStatus);
Resources res = getResources();
overallStatus.setBackgroundDrawable(res.getDrawable(R.drawable.progressbar_background));
overallStatus.setProgress(50);

画像にコーナーを追加しようとしましたが、うまくいきませんでした。誰かが私がここで間違っていることを知っていますか?または私は何が欠けていますか?また、どうすれば左右のリングを追加できるかわかりますか?リソース: enter image description here

19
gunar

解決策(自分の答えに違和感を覚える):まず、1つの問題は、進行状況の描画可能サイズが背景とは異なることでした(愚かな私!)。また、プログレスドローアブルにはクリップxmlが必要でした。 progressbar_progress_clip.xmlのようなもの:

<?xml version="1.0" encoding="utf-8"?>
<clip
    xmlns:Android="http://schemas.Android.com/apk/res/Android"
    Android:drawable="@drawable/progressbar_progressing"
    Android:clipOrientation="horizontal"
    Android:gravity="left"/>

次に、プログレスバーと2つの画像を相対レイアウトで追加して、ステータスバーの後に画像を描画できるようにします。このようなもの:

<RelativeLayout
                Android:id="@+id/relativeLayout1"
                Android:layout_width="0dip"
                Android:layout_height="fill_parent"
                Android:layout_marginLeft="10dip"
                Android:layout_marginRight="10dip"
                Android:layout_weight="94" >

                <ProgressBar
                    Android:id="@+id/pBarOverallStatus"
                    style="?android:attr/progressBarStyleHorizontal"
                    Android:layout_width="fill_parent"
                    Android:layout_height="fill_parent"
                    Android:layout_marginBottom="2dp"
                    Android:layout_marginTop="2dp"
                    Android:indeterminateOnly="false"
                    Android:max="100"
                    Android:progressDrawable="@drawable/progressbar_progress_clip" >
                </ProgressBar>

                <ImageView
                    Android:id="@+id/ringLeft"
                    Android:layout_width="wrap_content"
                    Android:layout_height="fill_parent"
                    Android:layout_alignParentLeft="true"
                    Android:layout_centerVertical="true"
                    Android:layout_marginLeft="7dp"
                    Android:contentDescription="@string/status_bar_ring"
                    Android:src="@drawable/status_bar_ring" />

                <ImageView
                    Android:id="@+id/ringRight"
                    Android:layout_width="wrap_content"
                    Android:layout_height="fill_parent"
                    Android:layout_alignParentRight="true"
                    Android:layout_centerVertical="true"
                    Android:layout_marginRight="7dp"
                    Android:contentDescription="@string/status_bar_ring"
                    Android:src="@drawable/status_bar_ring" />
            </RelativeLayout>

みんなありがとう!

29
gunar

ドローアブルを保持するImageViewを使用してFrameLayoutを作成し、そのアルファ値を低い値に設定できます。次に、同じFrameLayoutにClipDrawableを使用してProgressBarを作成します。そして、進行状況の更新でClipDrawableの値を設定します。

コード:

<FrameLayout
        Android:layout_gravity="center"
        Android:layout_width="match_parent"
        Android:layout_height="wrap_content">

    <ProgressBar
        Android:max="100"
        Android:id="@+id/progress_bar"
        Android:layout_gravity="center"
        style="?android:attr/progressBarStyleHorizontal"
        Android:layout_width="200dp"
        Android:layout_height="200dp"
        Android:progressDrawable="@drawable/custom_progress_image"
        Android:layout_marginRight="5dp" />

        <ImageView
            Android:alpha="0.4"
            Android:src="@drawable/app_logo"
            Android:layout_gravity="center"
            Android:layout_width="200dp"
            Android:layout_height="200dp" />
</FrameLayout> 
0
Shitij Goyal

まず、新しい描画可能なXMLファイルを作成します。

<?xml version="1.0" encoding="UTF-8"?> 
<shape
    xmlns:Android="http://schemas.Android.com/apk/res/Android" 
    Android:shape="rectangle"> 

    <corners
        Android:bottomRightRadius="7dp"
        Android:bottomLeftRadius="7dp"
        Android:topLeftRadius="7dp"
        Android:topRightRadius="7dp"/> 

</shape> 

次に、レイアウトで、次の属性をプログレスバーに追加します。

Android:background="@drawable/the_file_you_previously_created"

0
Manitoba