title: How to Create a Circular Progress Bar That Goes Up With Checked Checboxes
body: <p>Hello im trying to make a code that counts checkboxes and shows the percentile on circular progress bar. But i had issues with how to do i searched net for this but couldnt find anything so could you pls help me ?</p>
  <p>I have 24 checkBox and i thought if i make the max of progress bar 120 i can calculate with every checked box is equals to 5 so i made the max 120 on xml layout.Idk if its logical or what needs to be done but idk how to make this. And the other buttons is for ui not for this check box and progress bar part.</p>
  <p>Sorry For Bad Eng I may have mistakes in the sentences</p>
  <p>This is my layout xml</p>
  <pre><code>&lt;?xml version=&quot;1.0&quot; encoding=&quot;utf-8&quot;?&gt;
  &lt;androidx.constraintlayout.widget.ConstraintLayout 
  xmlns:android=&quot;http://schemas.android.com/apk/res/android&quot;
  xmlns:app=&quot;http://schemas.android.com/apk/res-auto&quot;
  xmlns:tools=&quot;http://schemas.android.com/tools&quot;
  android:layout_width=&quot;match_parent&quot;
  android:layout_height=&quot;match_parent&quot;
  android:background=&quot;@drawable/program_menu_v2&quot;
  tools:context=&quot;.ProgramActivity&quot;&gt;
  
  &lt;Button
      android:id=&quot;@+id/options_btn2&quot;
      android:layout_width=&quot;50dp&quot;
      android:layout_height=&quot;50dp&quot;
      android:background=&quot;#00FFFFFF&quot;
      app:layout_constraintEnd_toEndOf=&quot;parent&quot;
      app:layout_constraintTop_toTopOf=&quot;parent&quot; /&gt;
  
  &lt;Button
      android:id=&quot;@+id/anamenu_btn2&quot;
      android:layout_width=&quot;49dp&quot;
      android:layout_height=&quot;51dp&quot;
      android:layout_marginStart=&quot;16dp&quot;
      android:layout_marginBottom=&quot;16dp&quot;
      android:background=&quot;#00FFFFFF&quot;
      app:layout_constraintBottom_toBottomOf=&quot;parent&quot;
      app:layout_constraintStart_toStartOf=&quot;parent&quot; /&gt;
  
  &lt;Button
      android:id=&quot;@+id/profil_btn2&quot;
      android:layout_width=&quot;49dp&quot;
      android:layout_height=&quot;51dp&quot;
      android:layout_marginStart=&quot;8dp&quot;
      android:layout_marginEnd=&quot;16dp&quot;
      android:layout_marginBottom=&quot;16dp&quot;
      android:background=&quot;#00FFFFFF&quot;
      app:layout_constraintBottom_toBottomOf=&quot;parent&quot;
      app:layout_constraintEnd_toEndOf=&quot;parent&quot;
      app:layout_constraintStart_toEndOf=&quot;@+id/forum_btn2&quot; /&gt;
  
  &lt;Button
      android:id=&quot;@+id/forum_btn2&quot;
      android:layout_width=&quot;49dp&quot;
      android:layout_height=&quot;51dp&quot;
      android:layout_marginStart=&quot;16dp&quot;
      android:layout_marginBottom=&quot;16dp&quot;
      android:background=&quot;#00FFFFFF&quot;
      app:layout_constraintBottom_toBottomOf=&quot;parent&quot;
      app:layout_constraintStart_toEndOf=&quot;@+id/rehber_btn2&quot; /&gt;
  
  &lt;Button
      android:id=&quot;@+id/rehber_btn2&quot;
      android:layout_width=&quot;49dp&quot;
      android:layout_height=&quot;51dp&quot;
      android:layout_marginStart=&quot;16dp&quot;
      android:layout_marginBottom=&quot;16dp&quot;
      android:background=&quot;#00FFFFFF&quot;
      app:layout_constraintBottom_toBottomOf=&quot;parent&quot;
      app:layout_constraintStart_toEndOf=&quot;@+id/veriler_btn2&quot; /&gt;
  
  &lt;Button
      android:id=&quot;@+id/veriler_btn2&quot;
      android:layout_width=&quot;49dp&quot;
      android:layout_height=&quot;51dp&quot;
      android:layout_marginStart=&quot;93dp&quot;
      android:layout_marginBottom=&quot;16dp&quot;
      android:background=&quot;#00FFFFFF&quot;
      app:layout_constraintBottom_toBottomOf=&quot;parent&quot;
      app:layout_constraintStart_toEndOf=&quot;@+id/anamenu_btn2&quot; /&gt;
  
  &lt;LinearLayout
      android:layout_width=&quot;wrap_content&quot;
      android:layout_height=&quot;wrap_content&quot;
      android:layout_marginTop=&quot;146dp&quot;
      android:orientation=&quot;vertical&quot;
      app:layout_constraintEnd_toEndOf=&quot;parent&quot;
      app:layout_constraintStart_toStartOf=&quot;parent&quot;
      app:layout_constraintTop_toTopOf=&quot;parent&quot;&gt;
  
      &lt;LinearLayout
          android:layout_width=&quot;wrap_content&quot;
          android:layout_height=&quot;wrap_content&quot;
          android:orientation=&quot;horizontal&quot;&gt;
  
          &lt;CheckBox
              android:id=&quot;@+id/cb1_1&quot;
              android:layout_width=&quot;40dp&quot;
              android:layout_height=&quot;40dp&quot;
              android:layout_marginStart=&quot;-7.8dp&quot;
              android:layout_marginEnd=&quot;10dp&quot; /&gt;
  
          &lt;CheckBox
              android:id=&quot;@+id/cb1_2&quot;
              android:layout_width=&quot;40dp&quot;
              android:layout_height=&quot;40dp&quot;
              android:layout_marginHorizontal=&quot;15dp&quot; /&gt;
  
          &lt;CheckBox
              android:id=&quot;@+id/cb1_3&quot;
              android:layout_width=&quot;wrap_content&quot;
              android:layout_height=&quot;40dp&quot;
              android:layout_marginHorizontal=&quot;9dp&quot; /&gt;
  
          &lt;CheckBox
              android:id=&quot;@+id/cb1_4&quot;
              android:layout_width=&quot;40dp&quot;
              android:layout_height=&quot;40dp&quot;
              android:layout_marginHorizontal=&quot;15dp&quot; /&gt;
  
          &lt;CheckBox
              android:id=&quot;@+id/cb1_5&quot;
              android:layout_width=&quot;40dp&quot;
              android:layout_height=&quot;40dp&quot;
              android:layout_marginHorizontal=&quot;13dp&quot; /&gt;
  
          &lt;CheckBox
              android:id=&quot;@+id/cb1_6&quot;
              android:layout_width=&quot;40dp&quot;
              android:layout_height=&quot;40dp&quot;
              android:layout_marginHorizontal=&quot;23dp&quot; /&gt;
      &lt;/LinearLayout&gt;
  
      &lt;LinearLayout
          android:layout_width=&quot;wrap_content&quot;
          android:layout_height=&quot;wrap_content&quot;
          android:layout_marginTop=&quot;18dp&quot;
          android:orientation=&quot;horizontal&quot;&gt;
  
  
          &lt;CheckBox
              android:id=&quot;@+id/cb2_1&quot;
              android:layout_width=&quot;40dp&quot;
              android:layout_height=&quot;40dp&quot;
              android:layout_marginStart=&quot;-7.8dp&quot;
              android:layout_marginEnd=&quot;10dp&quot; /&gt;
  
          &lt;CheckBox
              android:id=&quot;@+id/cb2_2&quot;
              android:layout_width=&quot;40dp&quot;
              android:layout_height=&quot;40dp&quot;
              android:layout_marginHorizontal=&quot;15dp&quot; /&gt;
  
          &lt;CheckBox
              android:id=&quot;@+id/cb2_3&quot;
              android:layout_width=&quot;wrap_content&quot;
              android:layout_height=&quot;40dp&quot;
              android:layout_marginHorizontal=&quot;9dp&quot; /&gt;
  
          &lt;CheckBox
              android:id=&quot;@+id/cb2_4&quot;
              android:layout_width=&quot;40dp&quot;
              android:layout_height=&quot;40dp&quot;
              android:layout_marginHorizontal=&quot;15dp&quot; /&gt;
  
          &lt;CheckBox
              android:id=&quot;@+id/cb2_5&quot;
              android:layout_width=&quot;40dp&quot;
              android:layout_height=&quot;40dp&quot;
              android:layout_marginHorizontal=&quot;13dp&quot; /&gt;
  
          &lt;CheckBox
              android:id=&quot;@+id/cb2_6&quot;
              android:layout_width=&quot;40dp&quot;
              android:layout_height=&quot;40dp&quot;
              android:layout_marginHorizontal=&quot;23dp&quot; /&gt;
      &lt;/LinearLayout&gt;
  
      &lt;LinearLayout
          android:layout_width=&quot;wrap_content&quot;
          android:layout_height=&quot;wrap_content&quot;
          android:layout_marginTop=&quot;20dp&quot;
          android:orientation=&quot;horizontal&quot;&gt;
  
          &lt;CheckBox
              android:id=&quot;@+id/cb3_1&quot;
              android:layout_width=&quot;40dp&quot;
              android:layout_height=&quot;40dp&quot;
              android:layout_marginStart=&quot;-7.8dp&quot;
              android:layout_marginEnd=&quot;10dp&quot; /&gt;
  
          &lt;CheckBox
              android:id=&quot;@+id/cb3_2&quot;
              android:layout_width=&quot;40dp&quot;
              android:layout_height=&quot;40dp&quot;
              android:layout_marginHorizontal=&quot;15dp&quot; /&gt;
  
          &lt;CheckBox
              android:id=&quot;@+id/cb3_3&quot;
              android:layout_width=&quot;wrap_content&quot;
              android:layout_height=&quot;40dp&quot;
              android:layout_marginHorizontal=&quot;9dp&quot; /&gt;
  
          &lt;CheckBox
              android:id=&quot;@+id/cb3_4&quot;
              android:layout_width=&quot;40dp&quot;
              android:layout_height=&quot;40dp&quot;
              android:layout_marginHorizontal=&quot;15dp&quot; /&gt;
  
          &lt;CheckBox
              android:id=&quot;@+id/cb3_5&quot;
              android:layout_width=&quot;40dp&quot;
              android:layout_height=&quot;40dp&quot;
              android:layout_marginHorizontal=&quot;13dp&quot; /&gt;
  
          &lt;CheckBox
              android:id=&quot;@+id/cb3_6&quot;
              android:layout_width=&quot;40dp&quot;
              android:layout_height=&quot;40dp&quot;
              android:layout_marginHorizontal=&quot;23dp&quot; /&gt;
  
      &lt;/LinearLayout&gt;
  
      &lt;LinearLayout
          android:layout_width=&quot;match_parent&quot;
          android:layout_height=&quot;match_parent&quot;
          android:orientation=&quot;horizontal&quot;
          android:layout_marginTop=&quot;19dp&quot;&gt;
  
          &lt;CheckBox
              android:id=&quot;@+id/cb4_1&quot;
              android:layout_width=&quot;40dp&quot;
              android:layout_height=&quot;40dp&quot;
              android:layout_marginStart=&quot;-7.8dp&quot;
              android:layout_marginEnd=&quot;10dp&quot;/&gt;
  
          &lt;CheckBox
              android:id=&quot;@+id/cb4_2&quot;
              android:layout_width=&quot;40dp&quot;
              android:layout_height=&quot;40dp&quot;
              android:layout_marginHorizontal=&quot;15dp&quot;/&gt;
  
          &lt;CheckBox
              android:id=&quot;@+id/cb4_3&quot;
              android:layout_width=&quot;wrap_content&quot;
              android:layout_height=&quot;40dp&quot;
              android:layout_marginHorizontal=&quot;9dp&quot;/&gt;
  
          &lt;CheckBox
              android:id=&quot;@+id/cb4_4&quot;
              android:layout_width=&quot;40dp&quot;
              android:layout_height=&quot;40dp&quot;
              android:layout_marginHorizontal=&quot;15dp&quot;/&gt;
  
          &lt;CheckBox
              android:id=&quot;@+id/cb4_5&quot;
              android:layout_width=&quot;40dp&quot;
              android:layout_height=&quot;40dp&quot;
              android:layout_marginHorizontal=&quot;13dp&quot;/&gt;
  
          &lt;CheckBox
              android:id=&quot;@+id/cb4_6&quot;
              android:layout_width=&quot;40dp&quot;
              android:layout_height=&quot;40dp&quot;
              android:layout_marginHorizontal=&quot;23dp&quot;/&gt;
      &lt;/LinearLayout&gt;
  
  &lt;/LinearLayout&gt;
  
  &lt;ProgressBar
      android:id=&quot;@+id/pb_tamamlama&quot;
      android:layout_width=&quot;120dp&quot;
      android:layout_height=&quot;120dp&quot;
      android:indeterminateOnly=&quot;false&quot;
      android:progressDrawable=&quot;@drawable/custom_progress_bar&quot;
      android:layout_marginStart=&quot;190dp&quot;
      android:layout_marginBottom=&quot;168dp&quot;
      tools:progress=&quot;60&quot;
      android:max=&quot;120&quot;
      app:layout_constraintBottom_toBottomOf=&quot;parent&quot;
      app:layout_constraintEnd_toEndOf=&quot;parent&quot;
      app:layout_constraintStart_toStartOf=&quot;parent&quot; /&gt;
  
  &lt;TextView
      android:id=&quot;@+id/tv_tamamlama_yuzde&quot;
      android:layout_width=&quot;wrap_content&quot;
      android:layout_height=&quot;wrap_content&quot;
      tools:text=&quot;60%&quot;
      android:textAppearance=&quot;@style/TextAppearance.AppCompat.Large&quot;
      app:layout_constraintBottom_toBottomOf=&quot;@+id/pb_tamamlama&quot;
      app:layout_constraintEnd_toEndOf=&quot;@+id/pb_tamamlama&quot;
      app:layout_constraintStart_toStartOf=&quot;@+id/pb_tamamlama&quot;
      app:layout_constraintTop_toTopOf=&quot;@+id/pb_tamamlama&quot; /&gt;
      &lt;/androidx.constraintlayout.widget.ConstraintLayout&gt;
  </code></pre>
  <p>Here is my activity.kt</p>
  <pre><code>package com.example.assk
  
  import android.content.Intent
  import android.os.Bundle
  import androidx.appcompat.app.AppCompatActivity
  import kotlinx.android.synthetic.main.activity_profil.*
  import kotlinx.android.synthetic.main.activity_program.*
  import kotlinx.android.synthetic.main.activity_veriler.*
  
  class ProgramActivity : AppCompatActivity() {
  
  override fun onCreate(savedInstanceState: Bundle?) {
      super.onCreate(savedInstanceState)
      setContentView(R.layout.activity_program)
  
      veriler_btn2.setOnClickListener {
          val intent =
              Intent(this@ProgramActivity, VerilerActivity::class.java)
          intent.flags =
              Intent.FLAG_ACTIVITY_NEW_TASK or Intent.FLAG_ACTIVITY_CLEAR_TASK
          startActivity(intent)
          finish()
      }
      anamenu_btn2.setOnClickListener {
          val intent =
              Intent(this@ProgramActivity, MainActivity::class.java)
          intent.flags =
              Intent.FLAG_ACTIVITY_NEW_TASK or Intent.FLAG_ACTIVITY_CLEAR_TASK
          startActivity(intent)
          finish()
      }
      profil_btn2.setOnClickListener {
          val intent =
              Intent(this@ProgramActivity, ProfilActivity::class.java)
          intent.flags =
              Intent.FLAG_ACTIVITY_NEW_TASK or Intent.FLAG_ACTIVITY_CLEAR_TASK
          startActivity(intent)
          finish()
      }
  
  }
  }
  </code></pre>
  <p>I know there is no written code about the thing i want to do but i added for instances. There is just codes of navigating ui.</p>
  <p>Here is my custom circular progress bar's xml codes</p>
  <pre><code>&lt;?xml version=&quot;1.0&quot; encoding=&quot;utf-8&quot;?&gt;
  &lt;layer-list xmlns:android=&quot;http://schemas.android.com/apk/res/android&quot;&gt;
  &lt;item&gt;
      &lt;shape
          android:shape=&quot;ring&quot;
          android:thicknessRatio=&quot;12&quot;
          android:useLevel=&quot;false&quot;&gt;
          &lt;solid android:color=&quot;#DDD&quot; /&gt;
      &lt;/shape&gt;
  &lt;/item&gt;
  &lt;item&gt;
      &lt;rotate
          android:fromDegrees=&quot;270&quot;
          android:toDegrees=&quot;270&quot;&gt;
          &lt;shape
              android:shape=&quot;ring&quot;
              android:thicknessRatio=&quot;12&quot;
              android:useLevel=&quot;true&quot;&gt;
              &lt;solid android:color=&quot;@color/teal_700&quot; /&gt;
          &lt;/shape&gt;
      &lt;/rotate&gt;
  &lt;/item&gt;
  &lt;/layer-list&gt;
  </code></pre>
  <p>This is all, could you guys help me and if there is anything i can do please let me know please.</p>