为什么我的 TopAppBar 没有在 android jetpack compose 中显示

Question

我正在尝试更改 TopAppBar 的背景颜色，但我的 TopAppBar 没有显示。我添加了下面的代码。我已经添加了所需的修改器，因此它可以将背景颜色显示为洋红色，但它不显示任何颜色。我什至不确定它是否显示 TopAppBar

import android.annotation.SuppressLint
import android.os.Bundle
import androidx.activity.ComponentActivity
import androidx.activity.compose.setContent
import androidx.compose.foundation.background
import androidx.compose.material3.ExperimentalMaterial3Api
import androidx.compose.material3.MaterialTheme
import androidx.compose.material3.Scaffold
import androidx.compose.material3.Surface
import androidx.compose.material3.Text
import androidx.compose.material3.TopAppBar
import androidx.compose.runtime.Composable
import androidx.compose.ui.Modifier
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.tooling.preview.Preview
import com.example.movieapp.ui.theme.MovieAppTheme

class MainActivity : ComponentActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContent {
             MyApp()
        }
    }
}

@SuppressLint("UnusedMaterial3ScaffoldPaddingParameter")
@OptIn(ExperimentalMaterial3Api::class)
@Composable
fun MyApp() {
    MovieAppTheme {
       Scaffold(topBar = {
                   MyTopAppBar()
       }) {

       }
    }
}

@OptIn(ExperimentalMaterial3Api::class)
@Composable
fun MyTopAppBar() {
    TopAppBar(title = {Text(text = "Hello")},
        Modifier.background(color = Color.Red)
    )
}

Answer 1

你必须使用TopAppBarColors

TopAppBar(title = {Text(text = "Hello")}, colors = TopAppBarDefaults.topAppBarColors(containerColor = Color.Red))

顺便说一句，关于“我什至不确定它是否显示它”，有一个简单的解决方案：布局检查器:)

Answer 2

请从 MyTopAppBar 函数中删除 Modifier.background 并添加以下代码：

fun MyTopAppBar() {
    TopAppBar(
        title = { Text(text = "Hello") },
        colors = TopAppBarDefaults.topAppBarColors(
            containerColor = Color.Magenta
        )
    )
}