Android에서 진행률 표시줄을 사용자 지정하는 방법
저는 제가 보여주고 싶은 앱을 만들고 있습니다.ProgressBar
하지만 기본 안드로이드를 교체하고 싶습니다.ProgressBar
.
그러면 어떻게 사용자 지정할 수 있습니까?ProgressBar
?
그러려면 그래픽과 애니메이션이 필요합니까?
다음 게시물을 읽었지만 작동하지 않았습니다.
사용자 정의ProgressBar
진행률 표시줄의 배경 및 진행률에 대한 속성을 정의해야 합니다.
이름이 지정된 XML 파일을 만듭니다.customprogressbar.xml
당신의res->drawable
폴더:
custom_syslogbar.xml
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<!-- Define the background properties like color etc -->
<item android:id="@android:id/background">
<shape>
<gradient
android:startColor="#000001"
android:centerColor="#0b131e"
android:centerY="1.0"
android:endColor="#0d1522"
android:angle="270"
/>
</shape>
</item>
<!-- Define the progress properties like start color, end color etc -->
<item android:id="@android:id/progress">
<clip>
<shape>
<gradient
android:startColor="#007A00"
android:centerColor="#007A00"
android:centerY="1.0"
android:endColor="#06101d"
android:angle="270"
/>
</shape>
</clip>
</item>
</layer-list>
이제 다음을 설정해야 합니다.progressDrawable
의 재산.customprogressbar.xml
(그릴 수 있음)
XML 파일 또는 활동(실행 시)에서 이 작업을 수행할 수 있습니다.
XML에서 다음을 수행합니다.
<ProgressBar
android:id="@+id/progressBar1"
style="?android:attr/progressBarStyleHorizontal"
android:progressDrawable="@drawable/custom_progressbar"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
런타임에 다음을 수행합니다.
// Get the Drawable custom_progressbar
Drawable draw=res.getDrawable(R.drawable.custom_progressbar);
// set the drawable as progress drawable
progressBar.setProgressDrawable(draw);
편집: 수정된 xml 레이아웃
복합적인 경우ProgressBar
이것처럼.
사용하다ClipDrawable
.
참고: 사용하지 않았습니다.
ProgressBar
이 예에서는ClipDrawable을 사용하여 이미지를 클리핑하여 이를 달성했습니다.Animation
.
A Drawable
다른 것을 클립하는.Drawable
이것을 근거로 하여Drawable
의 현재 수준 값입니다.당신은 아이가 얼마나 많은지 조절할 수 있습니다.Drawable
레벨에 따라 너비와 높이가 잘리고 전체 컨테이너의 위치를 제어하기 위한 중력도 잘립니다.Most often used to implement things like progress bars
로 추첨 가능한 레벨을 높임으로써.setLevel()
.
참고: 드로잉 가능한 수준이 0일 때는 완전히 잘라지고 보이지 않으며, 10,000일 때는 완전히 드러납니다.
저는 이것을 만들기 위해 이 두 개의 이미지를 사용했습니다.CustomProgressBar
.
가리비.png
ballon_ballon.png
기본 활동.java
public class MainActivity extends ActionBarActivity {
private EditText etPercent;
private ClipDrawable mImageDrawable;
// a field in your class
private int mLevel = 0;
private int fromLevel = 0;
private int toLevel = 0;
public static final int MAX_LEVEL = 10000;
public static final int LEVEL_DIFF = 100;
public static final int DELAY = 30;
private Handler mUpHandler = new Handler();
private Runnable animateUpImage = new Runnable() {
@Override
public void run() {
doTheUpAnimation(fromLevel, toLevel);
}
};
private Handler mDownHandler = new Handler();
private Runnable animateDownImage = new Runnable() {
@Override
public void run() {
doTheDownAnimation(fromLevel, toLevel);
}
};
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
etPercent = (EditText) findViewById(R.id.etPercent);
ImageView img = (ImageView) findViewById(R.id.imageView1);
mImageDrawable = (ClipDrawable) img.getDrawable();
mImageDrawable.setLevel(0);
}
private void doTheUpAnimation(int fromLevel, int toLevel) {
mLevel += LEVEL_DIFF;
mImageDrawable.setLevel(mLevel);
if (mLevel <= toLevel) {
mUpHandler.postDelayed(animateUpImage, DELAY);
} else {
mUpHandler.removeCallbacks(animateUpImage);
MainActivity.this.fromLevel = toLevel;
}
}
private void doTheDownAnimation(int fromLevel, int toLevel) {
mLevel -= LEVEL_DIFF;
mImageDrawable.setLevel(mLevel);
if (mLevel >= toLevel) {
mDownHandler.postDelayed(animateDownImage, DELAY);
} else {
mDownHandler.removeCallbacks(animateDownImage);
MainActivity.this.fromLevel = toLevel;
}
}
public void onClickOk(View v) {
int temp_level = ((Integer.parseInt(etPercent.getText().toString())) * MAX_LEVEL) / 100;
if (toLevel == temp_level || temp_level > MAX_LEVEL) {
return;
}
toLevel = (temp_level <= MAX_LEVEL) ? temp_level : toLevel;
if (toLevel > fromLevel) {
// cancel previous process first
mDownHandler.removeCallbacks(animateDownImage);
MainActivity.this.fromLevel = toLevel;
mUpHandler.post(animateUpImage);
} else {
// cancel previous process first
mUpHandler.removeCallbacks(animateUpImage);
MainActivity.this.fromLevel = toLevel;
mDownHandler.post(animateDownImage);
}
}
}
activity_main.xml
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingLeft="16dp"
android:paddingRight="16dp"
android:paddingTop="16dp"
android:paddingBottom="16dp"
android:orientation="vertical"
tools:context=".MainActivity">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<EditText
android:id="@+id/etPercent"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:inputType="number"
android:maxLength="3" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Ok"
android:onClick="onClickOk" />
</LinearLayout>
<FrameLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center">
<ImageView
android:id="@+id/imageView2"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:src="@drawable/scall" />
<ImageView
android:id="@+id/imageView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@drawable/clip_source" />
</FrameLayout>
clip_source.xml
<?xml version="1.0" encoding="utf-8"?>
<clip xmlns:android="http://schemas.android.com/apk/res/android"
android:clipOrientation="vertical"
android:drawable="@drawable/ballon_progress"
android:gravity="bottom" />
복합적인 경우HorizontalProgressBar
거스름돈만cliporientation
다음과 같이 clip_source.xml에 있습니다.
android:clipOrientation="horizontal"
여기에서 완전한 데모를 다운로드할 수 있습니다.
당신의 xml에
<ProgressBar
android:id="@+id/progressBar1"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
style="@style/CustomProgressBar"
android:layout_margin="5dip" />
그리고res/values/styles.xml
:
<resources>
<style name="CustomProgressBar" parent="android:Widget.ProgressBar.Horizontal">
<item name="android:indeterminateOnly">false</item>
<item name="android:progressDrawable">@drawable/custom_progress_bar_horizontal</item>
<item name="android:minHeight">10dip</item>
<item name="android:maxHeight">20dip</item>
</style>
<style name="AppTheme" parent="android:Theme.Light" />
</resources>
그리고.custom_progress_bar_horizontal
사용자 정의 진행률 표시줄을 정의하는 그리기 가능한 폴더에 저장된 xml입니다.자세한 내용은 이 블로그를 참조하십시오.
이것이 당신에게 도움이 되기를 바랍니다.
진행률 표시줄 결정(고정 기간)과 진행률 표시줄 결정(알 수 없는 기간)이라는 두 가지 유형의 진행률 표시줄이 있습니다.
두 가지 진행률 막대 유형의 그리기 가능한 도구는 그리기 가능한 도구를 xml 리소스로 정의하여 사용자 지정할 수 있습니다.진행률 표시줄 스타일 및 사용자 지정에 대한 자세한 내용은 http://www.zoftino.com/android-progressbar-and-custom-progressbar-examples 에서 확인할 수 있습니다.
고정 또는 수평 진행 표시줄 사용자 정의:
아래 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:gravity="center_vertical|fill_horizontal">
<shape android:shape="rectangle"
android:tint="?attr/colorControlNormal">
<corners android:radius="8dp"/>
<size android:height="20dp" />
<solid android:color="#90caf9" />
</shape>
</item>
<item android:id="@android:id/progress"
android:gravity="center_vertical|fill_horizontal">
<scale android:scaleWidth="100%">
<shape android:shape="rectangle"
android:tint="?attr/colorControlActivated">
<corners android:radius="8dp"/>
<size android:height="20dp" />
<solid android:color="#b9f6ca" />
</shape>
</scale>
</item>
</layer-list>
불확실한 진행률 표시줄 사용자 정의
아래 xml은 순환 진행률 표시줄 사용자 지정을 위한 그리기 가능한 리소스입니다.
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item android:id="@android:id/progress"
android:top="16dp"
android:bottom="16dp">
<rotate
android:fromDegrees="45"
android:pivotX="50%"
android:pivotY="50%"
android:toDegrees="315">
<shape android:shape="rectangle">
<size
android:width="80dp"
android:height="80dp" />
<stroke
android:width="6dp"
android:color="#b71c1c" />
</shape>
</rotate>
</item>
</layer-list>
스피너 타입의 경우 프로그레스바의 색상을 사용자 정의하려면 xml 파일이 필요하고 각각의 Java 파일에서 코드를 시작해야 합니다.
xml 파일을 만들고 progressbar.xml로 이름 지정
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="center"
tools:context=".Radio_Activity" >
<LinearLayout
android:id="@+id/progressbar"
android:layout_width="wrap_content"
android:layout_height="wrap_content" >
<ProgressBar
android:id="@+id/spinner"
android:layout_width="wrap_content"
android:layout_height="wrap_content" >
</ProgressBar>
</LinearLayout>
</LinearLayout>
다음 코드를 사용하여 다양한 예상 색상의 스피너를 얻습니다.여기서는 16진수 코드를 사용하여 스피너를 파란색으로 표시합니다.
Progressbar spinner = (ProgressBar) progrees.findViewById(R.id.spinner);
spinner.getIndeterminateDrawable().setColorFilter(Color.parseColor("#80DAEB"),
android.graphics.PorterDuff.Mode.MULTIPLY);
사용자 지정 그리기 가능 사용:
<?xml version="1.0" encoding="utf-8"?>
<rotate xmlns:android="http://schemas.android.com/apk/res/android"
android:fromDegrees="0"
android:toDegrees="360"
android:drawable="@drawable/my_drawable"
android:pivotX="50%"
android:pivotY="50%" />
에 res (밑에그추/림기그가능리)progress.xml
).my_drawable
xml,, png일 수 .
그런 다음 레이아웃에서 사용합니다.
<ProgressBar
android:id="@+id/progressBar"
android:indeterminateDrawable="@drawable/progress_circle"
...
/>
핫스타와 같은 사용자 정의 진행률 표시줄 만들기.
- 레이아웃 파일에 진행률 표시줄을 추가하고 그리기 가능한 파일로 불확실한 그리기 가능을 설정합니다.
activity_main.xml
<ProgressBar
style="?android:attr/progressBarStyleLarge"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_centerHorizontal="true"
android:id="@+id/player_progressbar"
android:indeterminateDrawable="@drawable/custom_progress_bar"
/>
- res\drawable에 새 xml 파일 생성
custom_message_bar.xml
<?xml version="1.0" encoding="utf-8"?>
<rotate xmlns:android="http://schemas.android.com/apk/res/android"
android:duration="2000"
android:fromDegrees="0"
android:pivotX="50%"
android:pivotY="50%"
android:toDegrees="1080" >
<shape
android:innerRadius="35dp"
android:shape="ring"
android:thickness="3dp"
android:useLevel="false" >
<size
android:height="80dp"
android:width="80dp" />
<gradient
android:centerColor="#80b7b4b2"
android:centerY="0.5"
android:endColor="#f4eef0"
android:startColor="#00938c87"
android:type="sweep"
android:useLevel="false" />
</shape>
</rotate>
Android에서 진행률 표시줄을 만드는 가장 간단한 방법은 다음과 같습니다.
초기화 및 대화 상자 표시:
MyProgressDialog progressdialog = new MyProgressDialog(getActivity()); progressdialog.show();
작성 방법:
public class MyProgressDialog extends AlertDialog { public MyProgressDialog(Context context) { super(context); getWindow().setBackgroundDrawable(new ColorDrawable(android.graphics.Color.TRANSPARENT)); } @Override public void show() { super.show(); setContentView(R.layout.dialog_progress); } }
레이아웃 XML 작성:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent" android:layout_height="match_parent" android:background="@android:color/transparent" android:clickable="true"> <RelativeLayout android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_centerInParent="true"> <ProgressBar android:id="@+id/progressbarr" android:layout_width="@dimen/eightfive" android:layout_height="@dimen/eightfive" android:layout_centerInParent="true" android:indeterminateDrawable="@drawable/progresscustombg" /> <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_centerHorizontal="true" android:layout_below="@+id/progressbarr" android:layout_marginTop="@dimen/_3sdp" android:textColor="@color/white" android:text="Please wait"/> </RelativeLayout> </RelativeLayout>
쉐이프 진행률custombg.xml 및 putres/drawable을 만듭니다.
<?xml version="1.0" encoding="utf-8"?> <rotate xmlns:android="http://schemas.android.com/apk/res/android" android:fromDegrees="0" android:pivotX="50%" android:pivotY="50%" android:toDegrees="360" > <shape android:innerRadiusRatio="3" android:shape="ring" android:thicknessRatio="20" android:useLevel="false" > <size android:height="@dimen/eightfive" android:width="@dimen/eightfive" /> <gradient android:centerY="0.50" android:endColor="@color/color_green_icash" android:startColor="#FFFFFF" android:type="sweep" android:useLevel="false" /> </shape> </rotate>
코드로 이 작업을 수행하려면 다음 샘플을 참조하십시오.
pd = new ProgressDialog(MainActivity.this);
pd.setProgressStyle(ProgressDialog.STYLE_SPINNER);
pd.getWindow().setBackgroundDrawable(new ColorDrawable(Color.TRANSPARENT));
pd.getWindow().setGravity(Gravity.CENTER_HORIZONTAL|Gravity.CENTER_VERTICAL);
TextView tv = new TextView(this);
tv.setTextColor(Color.WHITE);
tv.setTextSize(20);
tv.setText("Waiting...");
pd.setCustomTitle(tv);
pd.setIndeterminate(true);
pd.show();
텍스트 보기를 사용하면 텍스트의 색, 크기 및 글꼴을 변경할 수 있습니다.그렇지 않으면 평소처럼 setMessage()를 호출할 수 있습니다.
<ProgressBar
android:indeterminateDrawable="@drawable/loading"
style="?android:attr/progressBarStyleLarge"
android:layout_gravity="center"
android:layout_width="200dp"
android:layout_height="200dp"
android:scaleY="0.5"
android:scaleX="0.5"
android:id="@+id/progressBarGallery"/>
그리고.@drawable/loading
이라src\main\res\drawable\loading.gif
파일, 그리고 그것의 크기는 200 X 200입니다.
언급URL : https://stackoverflow.com/questions/16893209/how-to-customize-a-progress-bar-in-android
'programing' 카테고리의 다른 글
MySQL GROUP_CONCAT 출력을 여러 행으로 분할하는 더 좋은 방법이 있습니까?예를 들어 매 6개의 레코드 뒤에 말합니다. (0) | 2023.08.15 |
---|---|
오라클 11g에서 "선택" 쿼리에서 오프셋을 추가하는 방법은 무엇입니까? (0) | 2023.08.15 |
json에 일반적인 방법으로 존재하는 배열 요소에서 열 형성 (0) | 2023.08.15 |
C에서 C++의 신규/삭제와 동등한 것은 무엇입니까? (0) | 2023.08.15 |
플로팅 차일드 디브의 키를 부모 키로 확장하려면 어떻게 해야 합니까? (0) | 2023.08.10 |