ViewTreeObserver解析与实践

val observer = myView.viewTreeObserver
observer.addOnGlobalLayoutListener { 
    // 在布局完成后执行此处代码
}

View view = findViewById(R.id.my_view);
ViewTreeObserver vto = view.getViewTreeObserver();
vto.addOnGlobalLayoutListener(new ViewTreeObserver.OnGlobalLayoutListener() {
    @Override
    public void onGlobalLayout() {
        // 获取 View 的宽高
        int width = view.getWidth();
        int height = view.getHeight();
        Log.d("ViewTreeObserver", "Width: " + width + ", Height: " + height);
 
        // 移除监听器，避免重复回调
        if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.JELLY_BEAN) {
            view.getViewTreeObserver().removeOnGlobalLayoutListener(this);
        } else {
            view.getViewTreeObserver().removeGlobalOnLayoutListener(this);
        }
    }
});

inputLayout.getViewTreeObserver().addOnPreDrawListener(new ViewTreeObserver.OnPreDrawListener() {
    @Override
    public boolean onPreDraw() {
        inputLayout.getViewTreeObserver().removeOnPreDrawListener(this);
        // 调整输入框大小的代码逻辑
        return true;
    }
});

binding.myScrollView.getViewTreeObserver().addOnScrollChangedListener {
    // 处理滚动事件逻辑
}
 
binding.myEditText.getViewTreeObserver().addOnGlobalLayoutListener {
    // 处理键盘显示/隐藏事件逻辑
}
 
binding.root.getViewTreeObserver().addOnWindowFocusChangeListener { hasFocus ->
    if (hasFocus) {
        // 当窗口获得焦点时，执行相关逻辑
    }
}

private void performLayout() {
    // 执行布局
    mView.layout(...);
    // 分发全局布局事件
    if (mViewTreeObserver != null) {
        mViewTreeObserver.dispatchOnGlobalLayout();
    }
}

// 伪代码：ViewRootImpl 的布局流程
private void performTraversals() {
    // 1. 测量
    performMeasure();
    // 2. 布局
    performLayout();
    // 3. 触发全局布局监听
    mView.getViewTreeObserver().dispatchOnGlobalLayout();
    // 4. 绘制
    performDraw();
}

measure()    --> OnGlobalLayoutListener（布局完成）
     ↓
layout()     --> OnGlobalLayoutListener（布局完成）
     ↓
------> dispatchOnPreDraw() → OnPreDrawListener ✅
     ↓
draw(Canvas)
  ├─ onDraw()               --> 你自定义 View 绘制逻辑
  ├─ dispatchDraw()         --> 绘制子 View
  └─ onDrawForeground()     --> 绘制前景等
     ↓
------> dispatchOnDraw() → OnDrawListener ✅

package com.example.viewtreeobserve_bestpractices
 
import android.graphics.Color
import android.os.Bundle
import android.util.Log
import android.view.Gravity
import android.view.ViewTreeObserver
import android.widget.LinearLayout
import android.widget.ScrollView
import android.widget.TextView
import androidx.activity.enableEdgeToEdge
import androidx.appcompat.app.AppCompatActivity
import androidx.core.view.ViewCompat
import androidx.core.view.WindowInsetsCompat
import kotlin.math.max
import kotlin.math.min
 
/**
 * 通过 ScrollView + ViewTreeObserver.OnScrollChangedListener + OnPreDrawListener
 * 来挑战一个更贴近实际场景的复杂 UI 效果。你可以从这个练习中学到：
 *
 * 如何监听 View 滚动位置并做联动动画
 
 * 如何在绘制前修改 View 的属性
 *
 * 如何结合多种监听器，实现流畅的视觉效果
 */
 
class ScrollDemoActivity : AppCompatActivity() {
 
    private lateinit var scrollView: ScrollView
    private lateinit var container: LinearLayout
 
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        enableEdgeToEdge()
        setContentView(R.layout.activity_scroll_demo)
        ViewCompat.setOnApplyWindowInsetsListener(findViewById(R.id.main)) { v, insets ->
            val systemBars = insets.getInsets(WindowInsetsCompat.Type.systemBars())
            v.setPadding(systemBars.left, systemBars.top, systemBars.right, systemBars.bottom)
            insets
        }
 
        scrollView = findViewById(R.id.scrollView)
        container = findViewById(R.id.container)
 
        // 添加 30 个带卡片样式的 TextView
        for (i in 1..30) {
            val card = TextView(this).apply {
                text = "Card Item $i"
                textSize = 20f
                setBackgroundColor(Color.parseColor("#DDDDDD"))
                setTextColor(Color.BLACK)
                gravity = Gravity.CENTER
                alpha = 0f // 初始化透明
                setPadding(50, 100, 50, 100)
                layoutParams = LinearLayout.LayoutParams(
                    LinearLayout.LayoutParams.MATCH_PARENT,
                    LinearLayout.LayoutParams.WRAP_CONTENT
                ).apply {
                    bottomMargin = 40
                }
            }
            container.addView(card)
        }
 
        // 使用 OnPreDrawListener 实现淡入动画
        container.viewTreeObserver.addOnPreDrawListener(object :
            ViewTreeObserver.OnPreDrawListener {
            override fun onPreDraw(): Boolean {
                container.viewTreeObserver.removeOnPreDrawListener(this)
                for (i in 0 until container.childCount) {
                    val child = container.getChildAt(i)
 
                    val screenHeight = scrollView.height
                    val childTop = child.top
                    val childAlpha = max(0.1f, childTop / screenHeight.toFloat())
 
                    child.animate()
                        .alpha(childAlpha)
                        .setDuration(800)
                        // 逐个展开动画
                        .setStartDelay(i * 80L)
                        .start()
                }
                return true
            }
        })
 
        container.viewTreeObserver.addOnDrawListener {
            val item1 = container.getChildAt(0)
            Log.d("alphaTest", "pre-draw 时 alpha = ${item1.alpha}")
        }
 
        // 使用 OnScrollChangedListener 实现滚动联动缩放 & 透明动画
        scrollView.viewTreeObserver.addOnScrollChangedListener {
            applyScrollEffect()
        }
    }
 
    private fun applyScrollEffect() {
        val scrollY = scrollView.scrollY
        val screenHeight = scrollView.height
 
        for (i in 0 until container.childCount) {
            val child = container.getChildAt(i)
 
            /**
             * child.top 是子 View 相对于父布局顶部的距离
             * scrollY 是 ScrollView 当前滚动的垂直距离
             *
             * 当child.top - scrollY > 0：表示子View在可视区域下方
             * 当child.top - scrollY < 0：表示子View在可视区域上方
             */
            val childTopInScroll = child.top - scrollY
            val ratio = childTopInScroll.toFloat() / screenHeight
 
            val scale = max(0.85f, min(1f, ratio))
            val alpha = max(0.1f, min(1f, ratio))
 
            child.scaleX = scale
            child.scaleY = scale
            child.alpha = alpha
        }
    }
 
}