Compose笔记(二十五)--Brush

        这一节主要了解一下Compose中Brush,在Jetpack Compose里，Brush是一个重要的 API，它用于定义填充图形的颜色渐变或图案，能够为界面元素添加丰富的视觉效果。简单总结如下:

1 常见场景
填充形状（圆形、矩形等）
创建渐变效果
实现纹理或图案
组合多个 Brush

2. 常用 Brush 类型

2.1 纯色填充（SolidColor）
// 直接使用Color作为Brush
drawCircle(color = Color.Red)
// 或显式创建SolidColor Brush
val brush = SolidColor(Color.Blue)
drawRect(brush = brush)2.2 线性渐变（LinearGradientBrush）
val brush = LinearGradientBrush(colors = listOf(Color.Red, Color.Blue),start = Offset(0f, 0f), end = Offset(size.width, size.height)  
)
drawRect(brush = brush)2.3 径向渐变（RadialGradientBrush）
val brush = RadialGradientBrush(colors = listOf(Color.Yellow, Color.Transparent),center = Offset(size.width / 2, size.height / 2), radius = size.minDimension / 2  // 半径
)
drawCircle(brush = brush, radius = size.minDimension / 2)2.4 扫描渐变（SweepGradientBrush）
val brush = SweepGradientBrush(colors = listOf(Color.Red, Color.Green, Color.Blue),center = Offset(size.width / 2, size.height / 2) 
)
drawCircle(brush = brush, radius = size.minDimension / 2)2.5 图像 Brush（ImageBrush）
val imageBitmap = painterResource(id = R.drawable.example).asImageBitmap()
val brush = ImageBrush(image = imageBitmap,contentScale = ContentScale.Crop
)
drawRect(brush = brush)

栗子:

import androidx.compose.animation.core.Animatable
import androidx.compose.animation.core.FastOutSlowInEasing
import androidx.compose.animation.core.infiniteRepeatable
import androidx.compose.animation.core.tween
import androidx.compose.foundation.background
import androidx.compose.foundation.layout.Box
import androidx.compose.foundation.layout.size
import androidx.compose.runtime.Composable
import androidx.compose.runtime.LaunchedEffect
import androidx.compose.runtime.remember
import androidx.compose.ui.Modifier
import androidx.compose.ui.graphics.Brush
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.tooling.preview.Preview
import androidx.compose.ui.unit.dp
import kotlinx.coroutines.launch@Composable
fun GradientExample() {val gradientOffset = remember { Animatable(0f) }LaunchedEffect(Unit) {launch {gradientOffset.animateTo(targetValue = 100f,animationSpec = infiniteRepeatable(animation = tween(durationMillis = 2000,easing = FastOutSlowInEasing)))}}val dynamicGradient = Brush.linearGradient(colors = listOf(Color.Red, Color.Yellow),start = androidx.compose.ui.geometry.Offset(0f, 0f),end = androidx.compose.ui.geometry.Offset(gradientOffset.value, gradientOffset.value))Box(modifier = Modifier.size(100.dp).background(brush = dynamicGradient))
}

import androidx.compose.animation.core.*
import androidx.compose.foundation.Canvas
import androidx.compose.foundation.layout.fillMaxSize
import androidx.compose.runtime.*
import androidx.compose.ui.Modifier
import androidx.compose.ui.geometry.Offset
import androidx.compose.ui.graphics.Brush
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.tooling.preview.Preview
import kotlin.math.cos
import kotlin.math.sin@Composable
fun RainbowGradient() {val angle by animateFloatAsState(targetValue = 360f,animationSpec = infiniteRepeatable(tween(5000, easing = LinearEasing)))val colors = listOf(Color(0xFFFF0000), // 红Color(0xFFFF7F00), // 橙Color(0xFFFFFF00), // 黄Color(0xFF00FF00), // 绿Color(0xFF0000FF), // 蓝Color(0xFF4B0082), // 靛Color(0xFF9400D3)  // 紫)Canvas(modifier = Modifier.fillMaxSize()) {val radians = angle * (Math.PI / 180).toFloat()val width = size.widthval height = size.heightval start = Offset(x = width / 2 + width / 2 * cos(radians),y = height / 2 + height / 2 * sin(radians))val end = Offset(x = width / 2 - width / 2 * cos(radians),y = height / 2 - height / 2 * sin(radians))drawRect(brush = Brush.linearGradient(colors = colors,start = start,end = end,tileMode = androidx.compose.ui.graphics.TileMode.Mirror))}
}

注意:
1 避免重复创建 Brush 实例:每次重组都创建新的Brush会导致不必要的内存分配和GC压力。使用remember缓存 Brush：

val gradientBrush = remember {LinearGradientBrush(colors = listOf(Color.Red, Color.Blue),start = Offset.Zero,end = Offset(size.width, size.height))
}

2 优先使用内置Brush工厂方法直接调用Brush.linearGradient()等方法，避免手动创建子类：

val brush = Brush.linearGradient(colors = listOf(...))// 不推荐
val brush = LinearGradientBrush(...)

3 对静态内容使用drawWithCache,缓存复杂Brush计算结果，避免重复绘制：

Modifier.drawWithCache {val cachedBrush = createComplexBrush()onDraw { drawRect(brush = cachedBrush) }
}