Jetpack Compose

Text(
    text = "Hello Compose",
    fontSize = 24.sp,
    fontWeight = FontWeight.Bold,
    color = Color.Blue,
    modifier = Modifier.padding(16.dp)
)

Button(
    onClick = { /* 点击事件 */ },
    colors = ButtonDefaults.buttonColors(
        backgroundColor = Color.Blue
    )
) {
    Text("点击我")
}

Image(
    painter = painterResource(R.drawable.image),
    contentDescription = "描述",
    modifier = Modifier.size(100.dp)
)

// 网络图片（使用 Coil）
AsyncImage(
    model = "https://example.com/image.jpg",
    contentDescription = null
)

var text by remember { mutableStateOf("") }

TextField(
    value = text,
    onValueChange = { text = it },
    label = { Text("输入内容") },
    placeholder = { Text("请输入...") }
)

Column(
    modifier = Modifier.fillMaxSize(),
    verticalArrangement = Arrangement.Center,
    horizontalAlignment = Alignment.CenterHorizontally
) {
    Text("Item 1")
    Text("Item 2")
    Text("Item 3")
}

Row(
    modifier = Modifier.fillMaxWidth(),
    horizontalArrangement = Arrangement.SpaceBetween,
    verticalAlignment = Alignment.CenterVertically
) {
    Text("Left")
    Text("Center")
    Text("Right")
}

Box(modifier = Modifier.size(200.dp)) {
    Image(painter = painterResource(R.drawable.bg), contentDescription = null)
    Text(
        text = "Overlay",
        modifier = Modifier.align(Alignment.Center)
    )
}

LazyColumn {
    items(users) { user ->
        UserItem(user)
    }
}

// 带索引
LazyColumn {
    itemsIndexed(users) { index, user ->
        Text("$index: ${user.name}")
    }
}

LazyRow {
    items(images) { image ->
        Image(painter = painterResource(image), contentDescription = null)
    }
}

LazyVerticalGrid(
    columns = GridCells.Fixed(2),
    contentPadding = PaddingValues(16.dp)
) {
    items(items) { item ->
        ItemCard(item)
    }
}

@Composable
fun Counter() {
    var count by remember { mutableStateOf(0) }
    
    Button(onClick = { count++ }) {
        Text("Count: $count")
    }
}

@Composable
fun SearchScreen() {
    var query by rememberSaveable { mutableStateOf("") }
    
    TextField(
        value = query,
        onValueChange = { query = it }
    )
}

@Composable
fun FilteredList(items: List<String>, query: String) {
    val filteredItems by remember(items, query) {
        derivedStateOf {
            items.filter { it.contains(query, ignoreCase = true) }
        }
    }
    
    LazyColumn {
        items(filteredItems) { item ->
            Text(item)
        }
    }
}

@Composable
fun UserScreen(viewModel: UserViewModel = viewModel()) {
    val uiState by viewModel.uiState.collectAsState()
    
    when (uiState) {
        is UiState.Loading -> LoadingView()
        is UiState.Success -> UserList(uiState.data)
        is UiState.Error -> ErrorView(uiState.message)
    }
}

@Composable
fun MyApp() {
    MaterialTheme(
        colors = lightColors(
            primary = Color(0xFF6200EE),
            secondary = Color(0xFF03DAC6)
        ),
        typography = Typography(
            h1 = TextStyle(fontSize = 30.sp, fontWeight = FontWeight.Bold)
        ),
        shapes = Shapes(
            small = RoundedCornerShape(4.dp),
            medium = RoundedCornerShape(8.dp),
            large = RoundedCornerShape(16.dp)
        )
    ) {
        AppContent()
    }
}

@Composable
fun MyApp() {
    val isDarkTheme = isSystemInDarkTheme()
    
    MaterialTheme(
        colors = if (isDarkTheme) darkColors() else lightColors()
    ) {
        AppContent()
    }
}

@Composable
fun ExpandableCard() {
    var expanded by remember { mutableStateOf(false) }
    
    Card(
        modifier = Modifier
            .fillMaxWidth()
            .animateContentSize()
            .clickable { expanded = !expanded }
    ) {
        Column {
            Text("Title")
            if (expanded) {
                Text("Content...")
            }
        }
    }
}

@Composable
fun AnimatedContent() {
    var visible by remember { mutableStateOf(true) }
    
    Column {
        Button(onClick = { visible = !visible }) {
            Text("Toggle")
        }
        
        AnimatedVisibility(visible = visible) {
            Text("Hello!")
        }
    }
}

@Composable
fun AnimatedButton() {
    var enabled by remember { mutableStateOf(true) }
    val alpha by animateFloatAsState(if (enabled) 1f else 0.5f)
    
    Button(
        onClick = { enabled = !enabled },
        modifier = Modifier.alpha(alpha)
    ) {
        Text("Click")
    }
}

@Composable
fun LoadDataScreen(userId: String) {
    var data by remember { mutableStateOf<Data?>(null) }
    
    LaunchedEffect(userId) {
        data = loadData(userId)
    }
    
    data?.let { DataView(it) }
}

@Composable
fun EventListener() {
    DisposableEffect(Unit) {
        val listener = EventListener { /* ... */ }
        registerListener(listener)
        
        onDispose {
            unregisterListener(listener)
        }
    }
}

@Composable
fun Analytics(screen: String) {
    SideEffect {
        analytics.logScreenView(screen)
    }
}

Text(
    text = "Click me",
    modifier = Modifier.clickable { /* 点击 */ }
)

Box(
    modifier = Modifier
        .size(200.dp)
        .pointerInput(Unit) {
            detectTapGestures(
                onTap = { /* 点击 */ },
                onLongPress = { /* 长按 */ },
                onDoubleTap = { /* 双击 */ }
            )
        }
)

var offsetX by remember { mutableStateOf(0f) }

Box(
    modifier = Modifier
        .offset { IntOffset(offsetX.roundToInt(), 0) }
        .draggable(
            orientation = Orientation.Horizontal,
            state = rememberDraggableState { delta ->
                offsetX += delta
            }
        )
)

LazyColumn {
    items(users, key = { it.id }) { user ->
        UserItem(user)
    }
}

@Composable
fun ExpensiveComposable(data: Data) {
    val processedData = remember(data) {
        expensiveOperation(data)
    }
    
    Text(processedData)
}

@Composable
fun FilteredList(items: List<Item>, filter: String) {
    val filtered by remember {
        derivedStateOf {
            items.filter { it.name.contains(filter) }
        }
    }
}