我的客户想要一个看起来像这样的菱形进度：
我的第一次尝试是使用库，但我找不到存在的库
我的下一个尝试是学习如何使用android附带的ProgressBar视图，并使用this答案设置我自己的drawable（最接近堆栈溢出的答案），但答案只适用于ring 形状，而不是矩形。
创建菱形进度视图的最佳方法是什么？ （无论如何：自定义视图、progressDrawable）我该怎么做？
【问题讨论】：
标签： android android-view android-progressbar
经过更多的测试，我想出了一个老套的答案。它只是与相对布局的边缘对齐的 4 个进度条，以及在它们顶部的 CardView。旋转整个东西，把它包在一个类中，然后你就得到了一个钻石进度条。 （使用数学计算每个条的进度）
在拐角处（进度条重叠的地方）可能有点奇怪，但总的来说效果很好
用法：
ViewGroup background;
int count = 1;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
//Something to add the progress bar to
background = (ViewGroup) findViewById(R.id.relative);
//initializing the progress bar
final DiamondProgress diamondProgress = new DiamondProgress(this);
diamondProgress.setMax(1000);
//adding the progress bar
background.addView(diamondProgress.getView());
/* Sample Code for animating the progress bar*/
new Timer().scheduleAtFixedRate(new TimerTask() {
@Override
public void run() {
runOnUiThread(new Runnable() {
@Override
public void run() {
diamondProgress.setProgress(count++);
}
});
}
}, 0, 25);
}
代码：
XML：布局/diamond_view
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:orientation="vertical"
android:layout_width="wrap_content"
android:rotation="45"
android:padding="43dp"
android:layout_height="wrap_content">
<RelativeLayout
android:layout_width="200dp"
android:layout_height="200dp">
<RelativeLayout
android:layout_width="wrap_content"
android:rotation="90"
android:layout_height="wrap_content">
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="8dp"
android:layout_alignParentBottom="true"
android:rotation="180">
<ProgressBar
android:layout_width="match_parent"
android:layout_height="8dp"
android:layout_marginLeft="3dp"
android:id="@+id/dp_progress4"
style="?android:attr/progressBarStyleHorizontal"
android:progressDrawable="@drawable/progress_drawable"
android:layout_alignParentBottom="true" />
</RelativeLayout>
</RelativeLayout>
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="8dp"
android:layout_alignParentBottom="true"
android:rotation="180">
<ProgressBar
android:layout_width="match_parent"
android:layout_height="8dp"
android:layout_marginLeft="3dp"
android:progress="50"
android:id="@+id/dp_progress3"
android:progressDrawable="@drawable/progress_drawable"
style="?android:attr/progressBarStyleHorizontal"/>
</RelativeLayout>
<RelativeLayout
android:layout_width="wrap_content"
android:rotation="90"
android:layout_height="match_parent">
<ProgressBar
android:layout_width="match_parent"
android:layout_height="8dp"
android:layout_marginLeft="3dp"
android:progress="100"
android:id="@+id/dp_progress2"
android:progressDrawable="@drawable/progress_drawable"
style="?android:attr/progressBarStyleHorizontal" />
</RelativeLayout>
<ProgressBar
android:layout_width="match_parent"
android:layout_height="8dp"
android:layout_marginLeft="3dp"
android:progress="100"
android:progressDrawable="@drawable/progress_drawable"
style="?android:attr/progressBarStyleHorizontal"
android:id="@+id/dp_progress1"/>
<android.support.v7.widget.CardView
android:layout_width="match_parent"
android:layout_margin="4dp"
android:id="@+id/dp_card"
android:elevation="10dp"
android:layout_height="match_parent">
<RelativeLayout
android:layout_width="wrap_content"
android:rotation="-45"
android:id="@+id/dp_addView"
android:layout_height="wrap_content">
<TextView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:text="Sample Inside Content"
android:id="@+id/dp_text"
android:gravity="center"
android:textSize="24sp"/>
</RelativeLayout>
</android.support.v7.widget.CardView>
</RelativeLayout>
</RelativeLayout>XML：drawable/progress_drawable
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<!-- background -->
<item android:id="@android:id/background">
<shape>
<corners android:radius="3dp"/>
<solid android:color="#f2f2f2" />
</shape>
</item>
<!-- for the actual progress bar -->
<item android:id="@android:id/progress">
<clip android:gravity="left">
<shape>
<corners android:radius="3dp"/>
<solid android:color="@color/colorAccent" />
</shape>
</clip>
</item>
</layer-list>Java 类
import android.content.Context;
import android.view.LayoutInflater;
import android.view.View;
import android.widget.ProgressBar;
import android.widget.RelativeLayout;
/**
* Created by Pythogen on 9/27/2017.
*/
public class DiamondProgress {
Context context;
View view;
RelativeLayout addView;
int progress = 0;
int max = 100;
ProgressBar p1;
ProgressBar p2;
ProgressBar p3;
ProgressBar p4;
public DiamondProgress(Context context) {
this.context = context;
view = LayoutInflater.from(context).inflate(R.layout.diamond_view, null);
addView = ((RelativeLayout) view.findViewById(R.id.dp_addView));
p1 = (ProgressBar) view.findViewById(R.id.dp_progress1);
p2 = (ProgressBar) view.findViewById(R.id.dp_progress2);
p3 = (ProgressBar) view.findViewById(R.id.dp_progress3);
p4 = (ProgressBar) view.findViewById(R.id.dp_progress4);
}
public View getView() {
return view;
}
public RelativeLayout getHostOfInsideContent() {
return addView;
}
public void setProgress(int progress) {
this.progress = progress;
updateProgressBar();
}
public void setMax(int max) {
this.max = max;
p1.setMax(max);
p2.setMax(max);
p3.setMax(max);
p4.setMax(max);
}
public void updateProgressBar() {
double prog = ((double)progress)/max;
if (prog<.25) {
p1.setProgress(this.progress*4);
p2.setProgress(0);
p3.setProgress(0);
p4.setProgress(0);
} else {
p1.setProgress(max);
if (prog<.5) {
p2.setProgress((this.progress*4)-max);
p3.setProgress(0);
p4.setProgress(0);
} else {
p2.setProgress(max);
if (prog<.75) {
p3.setProgress((this.progress*4)-max*2);
p4.setProgress(0);
} else {
p3.setProgress(max);
p4.setProgress((this.progress*4)-max*3);
}
}
}
}
}哦，如果您打算使用它，请务必将 CardView 依赖项添加到您的 build.grade compile 'com.android.support:cardview-v7:25.1.1'
【讨论】：