如何在片段内部使用Compose？

Question

文档描述了如何在Activity中创建UI（Jetpack Compose https://developer.android.com/jetpack/compose）。

class MainActivity : AppCompatActivity() {
override fun onCreate(savedInstanceState: Bundle?) {
    super.onCreate(savedInstanceState)
    setContent {
        Text("Hello world!")
    }
}

}

但是如何在片段中使用它？

Answer 1

{p>上的

setContent已被弃用。

以下内容自Compose v1.0.0-alpha01 起是正确的。

对于纯撰写用户界面ViewGroup：

Fragment

对于混合撰写用户界面class ComposeUIFragment : Fragment() { override fun onCreateView( inflater: LayoutInflater, container: ViewGroup?, savedInstanceState: Bundle? ): View? { return ComposeView(requireContext()).apply { setContent { Text(text = "Hello world.") } } } } -将Fragment添加到xml布局中，然后：

ComposeView

Answer 2

Compose 不需要 Fragments。您无需 Fragment 或 Activity 即可导航到另一个屏幕：

class MainActivity : AppCompatActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContent {
            val navController = rememberNavController()
            NavHost(navController, startDestination = "welcome") {
                composable("welcome") { WelcomeScreen(navController) }
                composable("secondScreen") { SecondScreen() }
            }
        }
    }
}

@Composable
fun WelcomeScreen(navController: NavController) {
    Column {
        Text(text = "Welcome!")
        Button(onClick = { navController.navigate("secondScreen") }) {
            Text(text = "Continue")
        }
    }
}

@Composable
fun SecondScreen() {
    Text(text = "Second screen!")
}

Answer 3

找到了：

class LoginFragment : Fragment() {

override fun onCreateView(
    inflater: LayoutInflater, container: ViewGroup?,
    savedInstanceState: Bundle?
): View? {
    // Inflate the layout for this fragment
    val fragmentView = inflater.inflate(R.layout.fragment_login, container, false)

    (fragmentView as ViewGroup).setContent {
        Hello("Jetpack Compose")
    }
    return fragmentView
}

@Composable
fun Hello(name: String) = MaterialTheme {
    FlexColumn {
        inflexible {
            // Item height will be equal content height
            TopAppBar( // App Bar with title
                title = { Text("Jetpack Compose Sample") }
            )
        }
        expanded(1F) {
            // occupy whole empty space in the Column
            Center {
                // Center content
                Text("Hello $name!") // Text label
            }
        }
    }
 }
}

Answer 4

您可以在片段中创建onCreateView，然后定义所有

@Override
public View onCreateView(@NonNull LayoutInflater inflater, @Nullable ViewGroup  container, @Nullable Bundle savedInstanceState) {

    super.onCreate(savedInstanceState);
    final View view = inflater.inflate(R.layout.fragment_layout, container, false);

//You can define your code here
 //same like activity
//but use view. before findViewById it will work fine
    button= view.findViewById(R.id.button); 

    getData();

    return view;

}