Как добавить кнопку загрузки или пользовательский макет в центр индикатора выполнения? - PullRequest
Новая
       62

Как добавить кнопку загрузки или пользовательский макет в центр индикатора выполнения?

1 голос
/ 29 мая 2020
• 1000 изображение тоже? Пожалуйста, помогите.

Ответы [ 2 ]

3 голосов
/ 29 мая 2020

Вы должны создать customView. В вашем 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
    }

И customView 

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()
    }

}

https://i.stack.imgur.com/4x874.png

2 голосов
/ 29 мая 2020

Вы можете создать собственный макет, содержащий ваш progressBar, textView и imageView.

layout_custom_progressbar. xml

<xml version="1.0" encoding="utf-8"?>
   <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="wrap_content"
    android:layout_gravity="center"
    android:background="@color/white">

    <ProgressBar
        android:id="@+id/progressBar"
        style="?android:attr/progressBarStyle"
        android:layout_width="200dp"
        android:layout_height="200dp"
        android:layout_marginTop="16dp"
        android:layout_marginBottom="16dp"
        android:progressBackgroundTint="@color/colorPrimary"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHorizontal_chainStyle="packed"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintVertical_bias="0.0" />

    <TextView
        android:id="@+id/tvMessage"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Download PDF"
        android:textColor="@color/textColorPrimary"
        android:textSize="18sp"
        android:visibility="visible"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHorizontal_chainStyle="packed"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

    <ImageView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"/>

</androidx.constraintlayout.widget.ConstraintLayout>

Затем добавьте этот макет в желаемое действие, используя тег, и покажите или скройте его, используя свойство visibility . 

<include
    android:id="@+id/progressBar"
    layout="@layout/layout_custom_progressbar"
    android:visibility="gone"/>
...