This project is in early development and is not yet ready for use.
Add the plugin to your app.json
. This will allow your Android app to use Jetpack Compose.
{
"plugins": ["jetpack-compose-react-native"]
}
Next, prebuild your app.
npx expo prebuild -p android --clean
import { Button, Switch, Column, Text } from "jetpack-compose-react-native";
import { useState } from "react";
export default function App() {
const [checked, setChecked] = useState(false);
return (
<Column>
<Text>Use Jetpack Compose views in your RN app!</Text>
<Button title="Press me" onClick={() => console.log("Button pressed")} />
<Switch
checked={checked}
onCheckedChange={(isChecked) => setChecked(isChecked)}
/>
</Column>
);
}
- Button
- Switch
- Slider
- Column
- Row
- Icon
- Progress Indicator (Circular + Linear)
- Checkbox
- Other types of buttons
- Card
- Spacer
- Chip
- Badge
- Horizontal Divider
- Vertical Divider
- Text Field
- Text
- Dialog
- Bottom Sheet
- Snackbar
- Bottom Sheet
- Time/Date Picker
- LazyColumn/Row (just add a
lazy
prop to the existing components) - LazyGrid (vertical and horizontal props from the same component)
- LazyStaggeredGrid (vertical and horizontal props from the same component)
- Box
- More modifiers!