android - 如何在进度条中心添加下载按钮或自定义布局?
问题描述
我想创建一个自定义进度条来显示下载进度,其中包含一个图标和文本视图。
有库和一些示例,但只有进度条内的文本视图,所以我如何也添加这个图像视图?请帮忙。
解决方案
您应该创建自定义视图。在您的 customView 中将是 textView,您将在onDraw
方法中添加圆圈和箭头。在这段代码中,我向您展示了绘制圆的过程
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent">
<com.lucid.dreaming.ui.guide.views.CustomView
android:id="@+id/custom_view"
android:layout_width="100dp"
android:layout_height="100dp"
android:layout_marginTop="@dimen/big_padding"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Some text"
android:textColor="@color/colorWhite"
app:layout_constraintBottom_toBottomOf="@id/custom_view"
app:layout_constraintEnd_toEndOf="@id/custom_view"
app:layout_constraintStart_toStartOf="@id/custom_view"
app:layout_constraintTop_toTopOf="@id/custom_view" />
</androidx.constraintlayout.widget.ConstraintLayout>
这里我添加了 CountDownTimer,它将显示进度条的工作(进度条在 20 秒后填充)。你可以调节这个数字。
override fun onCreateView(inflater: LayoutInflater, container: ViewGroup?, savedInstanceState: Bundle?): View? {
val view = inflater.inflate(R.layout.your_xml, container, false)
object : CountDownTimer(20000, 200) {
override fun onTick(millisUntilFinished: Long) {
customView.setProgress(counter)
counter++
}
override fun onFinish() {
}
}.start()
return view
}
和自定义视图
import android.content.Context
import android.graphics.Canvas
import android.graphics.Color
import android.graphics.Paint
import android.graphics.RectF
import android.util.AttributeSet
import android.util.Log
import android.view.View
class CustomView @JvmOverloads constructor(
context: Context,
attributeSet: AttributeSet? = null,
defStyleAttr: Int = 0
) : View(context, attributeSet, defStyleAttr) {
private var paint: Paint
private var radius: Float = 0f
private var angle = 0f
init {
paint = Paint()
paint.color = Color.GRAY
paint.setAntiAlias(true)
paint.strokeWidth = 5f
paint.style = Paint.Style.STROKE
Log.e("tag", "init")
}
override fun onDraw(canvas: Canvas) {
super.onDraw(canvas)
radius = (width/2f -1f)
paint.color = Color.GRAY
canvas.drawCircle(width.toFloat()/2, height.toFloat()/2, radius, paint)
paint.color = Color.GREEN
val oval = RectF(0f,0f,width.toFloat()-2,width.toFloat()-2)
canvas.drawArc(oval, -90f,angle,false ,paint)
}
fun setProgress(percent: Int) {
angle = percent*3.6f
invalidate()
}
}
推荐阅读
- android - 与特定语言的深层链接
- mysql - MySQL - Generalization Specialization - How to update tables, enforce total participation, allow overlapping subclasses?
- ruby-on-rails - Rails 部分验证取决于控制器
- django - 更新 django rest 框架中的字段
- xamarin.forms - 使用普通 USB 网络摄像头模拟手机摄像头时出现问题
- ios - 如何使用 ECDH 加密快速创建 64 字节公钥和 32 字节私钥?
- excel - 如何从列表中获取最高值
- javascript - 为什么在提示后执行音频?
- go - 在golang中读取和解析xml文件但打印时没有错误和“0”值
- docker - 使用 nginx 设置 Docker 多容器。Nginx 无法识别主机(host not found in upstream)