ProgressBar/ProgressDialog에 커스텀 drawable 적용하기
조회수 4584회
구글에 떠도는 몇 개의 문서를 읽고, 단순히 새로운 스타일을 생성해서 ProgressBar의 style 속성값에 대입시키면 ProgressBar/ProgressDialog의 모양(drawable)을 쉽게 변경할 수 있다는 것을 알게 되었습니다. 그런데 실제로 해보니 잘되지 않네요. 지금까지 작업한 부분입니다.
다음과 같이 shape를 만들었습니다.(mp2.xml)
<?xml version="1.0" encoding="UTF-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="ring"
android:innerRadiusRatio="4"
android:thicknessRatio="4"
android:useLevel="false">
<size android:width="50dip" android:height="50dip" />
<gradient android:type="sweep" android:useLevel="false" android:startColor="#300000ff" android:centerColor="#500000ff" android:endColor="#ff0000ff" />
</shape>
그리고 animation입니다.(mp3.xml)
<?xml version="1.0" encoding="utf-8"?>
<animation-list xmlns:android="http://schemas.android.com/apk/res/android" android:oneshot="false">
<item android:duration="70">
<rotate xmlns:android="http://schemas.android.com/apk/res/android" android:drawable="@drawable/mp2" android:pivotX="50%" android:pivotY="50%" android:fromDegrees="0" android:toDegrees="30" android:repeatCount="1" />
</item>
<item android:duration="70">
<rotate xmlns:android="http://schemas.android.com/apk/res/android" android:drawable="@drawable/mp2" android:pivotX="50%" android:pivotY="50%" android:fromDegrees="30" android:toDegrees="60" android:repeatCount="1" />
</item>
<item android:duration="70">
<rotate xmlns:android="http://schemas.android.com/apk/res/android" android:drawable="@drawable/mp2" android:pivotX="50%" android:pivotY="50%" android:fromDegrees="60" android:toDegrees="90" android:repeatCount="1" />
</item>
<item android:duration="70">
<rotate xmlns:android="http://schemas.android.com/apk/res/android" android:drawable="@drawable/mp2" android:pivotX="50%" android:pivotY="50%" android:fromDegrees="90" android:toDegrees="120" android:repeatCount="1" />
</item>
<item android:duration="70">
<rotate xmlns:android="http://schemas.android.com/apk/res/android" android:drawable="@drawable/mp2" android:pivotX="50%" android:pivotY="50%" android:fromDegrees="120" android:toDegrees="150" android:repeatCount="1" />
</item>
<item android:duration="70">
<rotate xmlns:android="http://schemas.android.com/apk/res/android" android:drawable="@drawable/mp2" android:pivotX="50%" android:pivotY="50%" android:fromDegrees="150" android:toDegrees="180" android:repeatCount="1" />
</item>
<item android:duration="70">
<rotate xmlns:android="http://schemas.android.com/apk/res/android" android:drawable="@drawable/mp2" android:pivotX="50%" android:pivotY="50%" android:fromDegrees="180" android:toDegrees="210" android:repeatCount="1" />
</item>
<item android:duration="70">
<rotate xmlns:android="http://schemas.android.com/apk/res/android" android:drawable="@drawable/mp2" android:pivotX="50%" android:pivotY="50%" android:fromDegrees="210" android:toDegrees="240" android:repeatCount="1" />
</item>
<item android:duration="70">
<rotate xmlns:android="http://schemas.android.com/apk/res/android" android:drawable="@drawable/mp2" android:pivotX="50%" android:pivotY="50%" android:fromDegrees="240" android:toDegrees="270" android:repeatCount="1" />
</item>
<item android:duration="70">
<rotate xmlns:android="http://schemas.android.com/apk/res/android" android:drawable="@drawable/mp2" android:pivotX="50%" android:pivotY="50%" android:fromDegrees="270" android:toDegrees="300" android:repeatCount="1" />
</item>
<item android:duration="70">
<rotate xmlns:android="http://schemas.android.com/apk/res/android" android:drawable="@drawable/mp2" android:pivotX="50%" android:pivotY="50%" android:fromDegrees="300" android:toDegrees="330" android:repeatCount="1" />
</item>
<item android:duration="70">
<rotate xmlns:android="http://schemas.android.com/apk/res/android" android:drawable="@drawable/mp2" android:pivotX="50%" android:pivotY="50%" android:fromDegrees="330" android:toDegrees="360" android:repeatCount="1" />
</item>
</animation-list>
style입니다.(attrs.xml)
<?xml version="1.0" encoding="utf-8"?>
<resources>
<style parent="@android:style/Widget.ProgressBar" name="customProgressBar">
<item name="android:progressDrawable">@anim/mp3</item>
</style>
</resources>
Style 설정을 한 main.xml 입니다.
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent" android:drawingCacheQuality="high">
<ProgressBar android:id="@+id/ProgressBar01"
android:layout_width="wrap_content"
android:layout_height="wrap_content" style="@style/customProgressBar"/>
</LinearLayout>
이렇게 했는데도 여전히 같은 drawable이 보이네요. 무엇이 잘못된거죠?
1 답변
-
아래 코드는 제가 커스텀 progress bar를 만들 때 사용했던 부분입니다.
res/drawable/progress_bar_states.xml은 progress bar의 상태 별 색상을 선언한 파일입니다.
<layer-list xmlns:android="http://schemas.android.com/apk/res/android"> <item android:id="@android:id/background"> <shape> <gradient android:startColor="#000001" android:centerColor="#0b131e" android:centerY="0.75" android:endColor="#0d1522" android:angle="270" /> </shape> </item> <item android:id="@android:id/secondaryProgress"> <clip> <shape> <gradient android:startColor="#234" android:centerColor="#234" android:centerY="0.75" android:endColor="#a24" android:angle="270" /> </shape> </clip> </item> <item android:id="@android:id/progress"> <clip> <shape> <gradient android:startColor="#144281" android:centerColor="#0b1f3c" android:centerY="0.75" android:endColor="#06101d" android:angle="270" /> </shape> </clip> </item> </layer-list>
작성한 layout xml파일에 아래 코드를 추가하세요.
<ProgressBar android:id="@+id/progressBar" android:progressDrawable="@drawable/progress_bar_states" android:layout_width="fill_parent" android:layout_height="8dip" style="?android:attr/progressBarStyleHorizontal" android:indeterminateOnly="false" android:max="100"> </ProgressBar>
행운을 빕니다!
댓글 입력