読者です 読者をやめる 読者になる 読者になる

ProgressBarに画像を使う

Android

ProgressBarってバージョンごとに色が違ったり色合いがダサかったりでヤダ!
ってことで独自で定義するやり方。


背景画像(progress_back.png


メーター画像(progress_front.png


どちらも幅1pxの画像。

プログレスバーのdrawable

custom_progress.xml

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item
    	android:id="@android:id/background"
    	android:drawable="@drawable/progress_back"/>
    <item android:id="@android:id/progress">
        <clip android:drawable="@drawable/progress_front"/> 
    </item>
</layer-list> 

レイアウト

main.xml

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout
	xmlns:android="http://schemas.android.com/apk/res/android"
	android:layout_width="fill_parent"
	android:layout_height="fill_parent"
	android:background="#AAAAAAAA">
	<ProgressBar
		android:id="@+id/progress_bar"
		android:layout_width="200dp"
		android:layout_height="wrap_content"
		android:layout_gravity="center"
		android:progressDrawable="@drawable/custom_progress"
		style="?android:attr/progressBarStyleHorizontal" />
</FrameLayout>

アクティビティ

MainActivity.java

package com.sample;

import android.app.Activity;
import android.os.Bundle;
import android.widget.ProgressBar;

public class MainActivity extends Activity {
    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.main);
        
        ProgressBar progressBar = (ProgressBar) findViewById(R.id.progress_bar);
        progressBar.setMax(100);
        progressBar.setProgress(50);
    }
}

実行するとこんな感じになる。


ただし、現行のADT 10.0.1では、これ(main.xml)をグラフィカルエディタで表示した場合に、

java.lang.UnsupportedOperationException
Exception details are logged in Window > Show View > Error Log

となり、
android:progressDrawable="@drawable/custom_progress"
の部分でエラーが起きてエディタが使えない。


なので、プログラム上で

progressBar.setProgressDrawable(getResources().getDrawable(R.drawable.custom_progress));

って設定するほうが良いかも。