dispatchDraw(): wat is het, aanroepmechanisme en verschil met onDraw

Verschil tussen dispatchDraw en onDraw

onDraw is verantwoordelijk voor het tekenen van de inhoud van de View zelf — vormen, tekst, afbeeldingen die bij dit specifieke element horen. dispatchDraw is verantwoordelijk voor het tekenen van kind-Views — alle elementen die zich binnen de ViewGroup bevinden. Als ViewGroup dispatchDraw niet overschrijft, wordt de implementatie uit ViewGroup gebruikt, die gewoon recursief door childCount loopt en draw voor elk kind aanroept.

Voor ViewGroup die geen eigen inhoud tekent (bijv. FrameLayout, LinearLayout), kan onDraw worden geoptimaliseerd door setWillNotDraw(true) in te stellen. In dit geval wordt onDraw nooit aangeroepen, wat resources bespaart. dispatchDraw blijft ondertussen werken en draw aanroepen voor kindelementen. Alle standaard ViewGroups (LinearLayout, RelativeLayout, ConstraintLayout) gebruiken setWillNotDraw(true).

Als dispatchDraw wordt overschreven zonder super.dispatchDraw(canvas) aan te roepen, worden kind-Views niet getekend. Dit kan nuttig zijn voor het tijdelijk verbergen van alle kinderen, maar veroorzaakt in de meeste gevallen fouten. Aanbevolen praktijk: roep super.dispatchDraw(canvas) aan het begin van de overschreven methode aan en voeg dan uw eigen graphics (bijv. overlay met alfakanaal) over de kinderen toe.

Voorbeeld van het overschrijven van dispatchDraw in Kotlin

Laten we OverlayViewGroup maken — een aangepaste ViewGroup die een halfdoorzichtige laag met een tekstlabel over alle kind-Views toevoegt. dispatchDraw roept eerst super aan (tekenen van alle kinderen), tekent dan de overlay-rechthoek en tekst. Paint wordt in de constructor gemaakt om allocaties in de draw-lus te voorkomen.

class OverlayViewGroup(context: Context)
    : ViewGroup(context) {

    private val overlayPaint = Paint().apply {
        color = Color.parseColor("#66000000")
        style = Paint.Style.FILL
    }

    private val textPaint = Paint().apply {
        color = Color.WHITE
        textSize = 36f
        isAntiAlias = true
        textAlign = Paint.Align.CENTER
    }

    init {
        setWillNotDraw(false)
    }

    override fun dispatchDraw(canvas: Canvas) {
        super.dispatchDraw(canvas)
        canvas.drawRect(0f, 0f,
                        width.toFloat(),
                        height.toFloat(), overlayPaint)
        canvas.drawText("VOORVERTOONMODUS",
            width / 2f,
            height / 2f, textPaint)
    }

    override fun onLayout(changed: Boolean,
                       l: Int, t: Int,
                       r: Int, b: Int) {
        var top = t
        for (i in 0 until childCount) {
            val child = getChildAt(i)
            val cw = child.measuredWidth
            val ch = child.measuredHeight
            child.layout(l, top, l + cw, top + ch)
            top += ch
        }
    }

    override fun onMeasure(widthMeasureSpec: Int,
                       heightMeasureSpec: Int) {
        measureChildren(widthMeasureSpec, heightMeasureSpec)
        val maxWidth = resolveSize(
            getChildAt(0).measuredWidth,
            widthMeasureSpec)
        var totalHeight = 0
        for (i in 0 until childCount) {
            totalHeight += getChildAt(i).measuredHeight
        }
        setMeasuredDimension(maxWidth,
            resolveSize(totalHeight, heightMeasureSpec))
    }
}

Geanimeerde Z-order via dispatchDraw

Het volgende voorbeeld toont het wijzigen van de volgorde van het tekenen van kindelementen. CircularRevealLayout overschrijft dispatchDraw en tekent de kinderen in omgekeerde volgorde, waardoor een effect van omgekeerde Z-order ontstaat. Voor animatie wordt een cyclische verschuiving van de tekenindex toegevoegd op basis van de geanimeerde offset-waarde.

class ReverseOrderLayout(context: Context)
    : ViewGroup(context) {

    private var reverse = false

    override fun dispatchDraw(canvas: Canvas) {
        if (!reverse) {
            super.dispatchDraw(canvas)
            return
        }
        for (i in childCount - 1 downTo 0) {
            val child = getChildAt(i)
            if (child.visibility == GONE) continue
            drawChild(canvas, child, getDrawingTime())
        }
    }

    fun toggleReverse() {
        reverse = !reverse
        invalidate()
    }

    override fun onLayout(changed: Boolean,
                       l: Int, t: Int,
                       r: Int, b: Int) {
        var left = l
        for (i in 0 until childCount) {
            val child = getChildAt(i)
            val cw = child.measuredWidth
            child.layout(left, t,
                left + cw, t + child.measuredHeight)
            left += cw
        }
    }

    override fun onMeasure(widthMeasureSpec: Int,
                       heightMeasureSpec: Int) {
        measureChildren(widthMeasureSpec, heightMeasureSpec)
        var totalWidth = 0
        for (i in 0 until childCount) {
            totalWidth += getChildAt(i).measuredWidth
        }
        setMeasuredDimension(
            resolveSize(totalWidth, widthMeasureSpec),
            resolveSize(getChildAt(0).measuredHeight,
                heightMeasureSpec))
    }
}

Wanneer dispatchDraw gebruiken in Android

dispatchDraw wordt gebruikt in scenario's waarbij u het tekenproces van kind-Views moet beïnvloeden zonder de eigen inhoud van de ViewGroup aan te tasten. Belangrijkste scenario's: het toepassen van een gemeenschappelijk effect (overlay, shadow, gradient) over alle kinderen; het wijzigen van de Z-order-volgorde voor een diepte-effect; het animeren van het verschijnen of verdwijnen van kindelementen via Canvas-transformaties.

Als graphics onder kindelementen moeten worden geplaatst (achtergrond-effect), moet onDraw worden gebruikt — dispatchDraw wordt daarna aangeroepen. Als graphics over kinderen heen moeten worden geplaatst — gebruik dispatchDraw met super-aanroep en vervolgens Canvas.draw. Als een globale kleur- of transparantiewijziging nodig is, is het handig om canvas.saveLayerAlpha() in dispatchDraw te gebruiken, waarmee het tekenen van kinderen wordt omhuld.

Wordt niet aanbevolen om dispatchDraw te gebruiken voor: 1) het tekenen van complexe animaties in realtime (gebruik invalidate en onDraw); 2) het maken van screenshots van ViewGroup (gebruik buildDrawingCache() of View.draw(Canvas)); 3) het wijzigen van kind-Views (coördinaten, afmetingen — dit is de taak van onLayout, niet dispatchDraw). dispatchDraw — alleen voor het toepassen van visuele effecten.