title: Adjusting size of custom view in Android
body: <p>I've built a custom view for speed display in Android. My goal is that the custom view's size shall always fit the parent element. Like this:</p>
  <p><a href="https://i.stack.imgur.com/uuZs7.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/uuZs7.png" alt="how it's supposed to work" /></a></p>
  <p>I've already experimented with <code>onMeasure()</code>, but I couldn't figure out how to make it work.</p>
  <p>Here's the code of my custom view:</p>
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-html lang-html prettyprint-override"><code>import android.content.Context
  import android.graphics.*
  import android.util.AttributeSet
  import android.view.View
  import androidx.core.content.ContextCompat
  import de.hdm.rollingchassis.R
  import android.graphics.RectF
  import android.view.View.MeasureSpec
  import android.graphics.Typeface
  import android.text.TextPaint
  import android.util.Log
  
  
  class SpeedView : View {
  
      constructor(context: Context?) : super(context)
  
      constructor(context: Context?, attrs: AttributeSet?) : super(context, attrs)
  
      constructor(context: Context?, attrs: AttributeSet?, defStyle: Int) : super(
          context,
          attrs,
          defStyle
      )
  
      // speed arc
      var speedDisplaySize = 300F
      var trackColor = ContextCompat.getColor(context, R.color.white2)
      var progressColor = ContextCompat.getColor(context, R.color.white)
      var trackBorderWidth = 5.0F
      var startAngle = 120F   //  90 degrees is the bottom of the circle
      var sweepAngle = 0F
  
      // speed font
      var speed = 0F
      var speedFontColor = ContextCompat.getColor(context, R.color.white)
      var speedFont = "sans-serif-light"
      var speedFontSize = 90F
  
      // unit font
      var unitFont = "sans-serif"
      var unitFontSize = 25.0F
  
  
      override fun draw(canvas: Canvas?) {
  
          super.draw(canvas)
          canvas?.drawPath(path(300F), paint(trackColor))
          canvas?.drawPath(path(sweepAngle), paint(progressColor))
          canvas?.drawText(
              speed.toString(),
              (speedDisplaySize + trackBorderWidth) / 2,
              (speedDisplaySize + trackBorderWidth) / 2 + (speedFontSize / 4F),
              paintSpeed(speedFont, speedFontSize)
          )
          canvas?.drawText(
              "KM/H",
              (speedDisplaySize + trackBorderWidth) / 2,
              (speedDisplaySize + trackBorderWidth) / 2 + (speedFontSize / 4F) + 1.5F * unitFontSize,
              paintSpeed(unitFont, unitFontSize)
          )
  
  
      }
  
      private fun path(sweepAngle: Float): Path {
  
          val path = Path()
  
          var oval_start_x = trackBorderWidth / 2
          var oval_start_y = trackBorderWidth / 2
          var oval_end_x = oval_start_x + speedDisplaySize
          var oval_end_y = oval_start_y + speedDisplaySize
  
          val oval = RectF(oval_start_x, oval_start_y, oval_end_x, oval_end_y)
          path.addArc(oval, startAngle, sweepAngle)
  
          return path
  
      }
  
      private fun paint(color: Int): Paint {
  
          val paint = Paint()
          paint.color = color
          paint.strokeWidth = trackBorderWidth
          paint.style = Paint.Style.STROKE;
  
          return paint
  
      }
  
      private fun paintSpeed(font: String, fontSize: Float): Paint {
  
          val textPaint = TextPaint()
          textPaint.textSize = fontSize
          textPaint.textAlign = Paint.Align.CENTER
          textPaint.color = speedFontColor
          textPaint.typeface = Typeface.create(font, Typeface.NORMAL)
  
          return textPaint
  
      }
  
  }</code></pre>
  </div>
  </div>
  </p>
  <p>And this is the layout file:</p>
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;?xml version="1.0" encoding="utf-8"?&gt;
  &lt;androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
      xmlns:app="http://schemas.android.com/apk/res-auto"
      xmlns:tools="http://schemas.android.com/tools"
      android:layout_width="match_parent"
      android:layout_height="match_parent"&gt;
  
      &lt;androidx.constraintlayout.widget.ConstraintLayout
          android:layout_width="0dp"
          android:layout_height="match_parent"
          android:layout_marginStart="32dp"
          app:layout_constraintStart_toStartOf="parent"
          app:layout_constraintTop_toTopOf="parent"
          app:layout_constraintWidth_default="percent"
          app:layout_constraintWidth_percent="0.3"&gt;
  
          &lt;androidx.constraintlayout.widget.ConstraintLayout
              android:id="@+id/constraintLayout"
              android:layout_width="0dp"
              android:layout_height="0dp"
              app:layout_constraintHeight_default="percent"
              app:layout_constraintHeight_percent="0.5"
              app:layout_constraintStart_toStartOf="parent"
              app:layout_constraintTop_toTopOf="parent"
              app:layout_constraintWidth_default="percent"
              app:layout_constraintWidth_percent="0.5"&gt;
  
              &lt;androidx.constraintlayout.widget.ConstraintLayout
                  android:id="@+id/constraintLayout2"
                  android:layout_width="match_parent"
                  android:layout_height="0dp"
                  android:layout_marginTop="16dp"
                  app:layout_constraintBottom_toBottomOf="parent"
                  app:layout_constraintDimensionRatio="1:1"
                  app:layout_constraintHeight_default="percent"
                  app:layout_constraintHeight_percent="0.5"
                  app:layout_constraintStart_toStartOf="parent"
                  app:layout_constraintTop_toTopOf="parent"
                  app:layout_constraintVertical_bias="0.0"&gt;
  
                  &lt;com.example.views.SpeedView
                      android:id="@+id/sv"
                      android:layout_width="match_parent"
                      android:layout_height="match_parent"
                      android:layout_marginBottom="0dp"
                      app:layout_constraintBottom_toBottomOf="parent"
                      app:layout_constraintEnd_toEndOf="parent"
                      app:layout_constraintStart_toStartOf="parent"
                      app:layout_constraintTop_toTopOf="parent"
  
                      /&gt;
  
              &lt;/androidx.constraintlayout.widget.ConstraintLayout&gt;
  
          &lt;/androidx.constraintlayout.widget.ConstraintLayout&gt;
  
      &lt;/androidx.constraintlayout.widget.ConstraintLayout&gt;
  
  &lt;/androidx.constraintlayout.widget.ConstraintLayout&gt;</code></pre>
  </div>
  </div>
  </p>
  <p>I'd like the speed custom view to fit the size of the ConstraintLayout with ID <code>constraintLayout2</code>. Does anyone know how to make that work?</p>