Nat Strangerweather
09/24/2020, 4:46 PMGeert
09/24/2020, 5:32 PM// CircleShape does not work
Image(
asset = CircleShape,
modifier = Modifier
.preferredSize(16.dp)
.background(Color.Red)
)
// Show an Circle
Box(shape = CircleShape,
backgroundColor = Color.Red,
modifier = Modifier.preferredSize(16.dp)
) { }
// Material has no regular circle
Image(
asset = Icons.Default.AddCircle,
modifier = Modifier
.preferredSize(16.dp)
.background(Color.Red)
)
Răzvan Roșu
09/24/2020, 10:19 PMrkeazor
09/24/2020, 11:48 PMColton Idle
09/25/2020, 2:11 AM@Composable
private fun MyActivityScreen(items: List<String>) {
val myThings = remember { mutableStateOf(items) }
Column() {
myThings.value.forEach {
Text(text = it)
}
}
}
lib
09/25/2020, 3:33 AMMehdi Haghgoo
09/25/2020, 7:41 AMclass HomeFragment : Fragment() {
override fun onCreateView(
inflater: LayoutInflater,
container: ViewGroup?,
savedInstanceState: Bundle?
): View? = LinearLayout(context).apply{
addView(ComposeView(context).apply {
setContent {
BodyContent(this.findFragment())
}
})
}
}
@Composable
fun BodyContent(fragment: Fragment) {
val data = listOf("One", "Two", "Three", "Four", "Five")
Scaffold(
modifier = Modifier.background(Color.Black).fillMaxSize()
.background(Color.Blue),
topBar = {
MyTopAppBar()
},
bottomBar = {
MyBottomBar()
},
floatingActionButton = { MyFab(fragment) },
floatingActionButtonPosition = FabPosition.End,
snackbarHost = { },
drawerContent = { MyDrawer() }
){
LazyColumnFor(items = data, modifier = Modifier
.background(Color.Green),
itemContent = {item->
Text(item, modifier = Modifier.padding(8.dp))
}
)
}
}
@Composable
fun MyDrawer() {
val items = arrayOf("My Account", "Monthly Cost", "Savings Report")
Box(paddingStart = 32.dp) {
Column(modifier = Modifier.align(Alignment.CenterVertically)) {
for (item in items) {
Text(item, modifier = Modifier.padding(8.dp))
}
}
}
}
@Composable
fun MyTopAppBar() {
TopAppBar(modifier = Modifier.padding(8.dp, 16.dp, 8.dp, 8.dp)) {
if(gCost != null){
Text("Cost is $gCost", modifier = Modifier.border(1.dp, Color.Red))
}
Icon(Icons.Default.Add, modifier = Modifier.clip(RoundedCornerShape(8.dp)))
Icon(Icons.Default.AccountBox, modifier = Modifier.clip(RoundedCornerShape(8.dp)))
Icon(Icons.Default.ExitToApp, modifier = Modifier.clip(RoundedCornerShape(8.dp)))
Icon(Icons.Default.ArrowBack, modifier = Modifier.clip(RoundedCornerShape(8.dp)))
}
}
@Composable
fun MyBottomBar() {
BottomAppBar() {
Row(){
Icon(Icons.Default.Person, modifier = Modifier.clip(RoundedCornerShape(8.dp)).weight(0.25f))
Icon(Icons.Default.Call, modifier = Modifier.clip(RoundedCornerShape(8.dp)).weight(0.25f))
Icon(Icons.Default.Send, modifier = Modifier.clip(RoundedCornerShape(8.dp)).weight(0.25f))
Icon(Icons.Default.Refresh, modifier = Modifier.clip(RoundedCornerShape(8.dp)).weight(0.25f))
}
}
}
@Composable
fun MyFab(fragment: Fragment) {
FloatingActionButton(
icon = { Icon(Icons.Default.Add) },
onClick = {
findNavController(fragment).navigate(HomeFragmentDirections.actionHomeFragmentToAddCostActivity())
launchActivity = true
},
modifier = Modifier.padding(8.dp)
)
}
Mehdi Haghgoo
09/25/2020, 12:45 PMRăzvan Roșu
09/25/2020, 2:04 PMcolors.xml
and colors-night.xml
(besides the primaryColor, secondaryColor and so on) without using the xml resources.
<!-- colors.xml -->
<color name="customers_button_background">#123456</color>
<color name="customers_button_content">#FFFFFF</color>
<!-- colors-night.xml -->
<color name="customers_button_background">#7890AB</color>
<color name="customers_button_content">#000000</color>
How can I achieve this in Compose? Thanks!mmaillot
09/25/2020, 2:20 PMBottomDrawerLayout
? I want to use it to show information about marker on the map. I want to disable the expandable
state.
And where can I found the open source code of Compose ?Vinay Gaba
09/25/2020, 8:59 PMSean McQuillan [G]
09/25/2020, 9:02 PMrkeazor
09/25/2020, 9:22 PMColton Idle
09/26/2020, 2:50 AMMehdi Haghgoo
09/26/2020, 5:41 AMremember{}
always recommended when dealing with some state?Javier
09/26/2020, 1:26 PMNat Strangerweather
09/26/2020, 5:25 PMfun checkNotificationPolicyAccess(
notificationManager: NotificationManager,
context: Context
): Boolean {
if (notificationManager.isNotificationPolicyAccessGranted) {
Toast.makeText(context, "Notification policy access granted.", Toast.LENGTH_SHORT).show()
return true
} else {
// add dialog here
}
return false
}
How can I do that? The composable looks like this:
@Composable
fun NotificationPolicyPermissionDialog() {
val openDialog = remember { mutableStateOf(true) }
Dialog(onDismissRequest = { openDialog.value = false }) {
Box(Modifier.preferredSize(100.dp, 100.dp), backgroundColor = Color.White)
}
}
Karthick
09/26/2020, 6:45 PMrkeazor
09/26/2020, 7:08 PMJeremy
09/26/2020, 7:42 PMWebComponent
belong to?Sergey Y.
09/26/2020, 7:58 PMYann Badoual
09/26/2020, 8:11 PMState
considered Stable
because any changes will cause a recomposition? (If not then why?)bruno.aybar
09/26/2020, 10:13 PMStack {
Image(Modifier.alignment(Alignment.Center)) // want to center & rotate 45 degrees
}
Kane Shih
09/27/2020, 6:27 AMcomposable manager
like resource manager
in Android Studio to preview all of them?Wajahat Karim
09/27/2020, 9:04 AMMohammad Sianaki
09/27/2020, 12:22 PMModifier.fillMaxHeight()
is not working, can some one explain me what I am doing wrong?
Row(Modifier.padding(horizontal = 32.dp, vertical = 16.dp).background(Color.Red)) {
Column(Modifier.fillMaxHeight().weight(1f).background(Color.Cyan)) {
Row {
Image(
asset = imageResource(id = Drawables.mappin),
Modifier.gravity(Alignment.CenterVertically)
)
Column(Modifier.padding(start = 16.dp)) {
Text(
text = "Address", style = TextStyle(
color = Color.Black.copy(alpha = 0.7f),
fontSize = 20.sp
)
)
Text(
text = "House # 2, Road # 5, Green Road Dhanmondi, Dhaka, Bangladesh",
style = TextStyle(color = Color.Gray)
)
}
}
Row {
Image(
asset = imageResource(id = Drawables.clock),
Modifier.gravity(Alignment.CenterVertically)
)
Column(Modifier.padding(start = 16.dp)) {
Text(
text = "Daily Practice", style = TextStyle(
color = Color.Black.copy(alpha = 0.7f),
fontSize = 20.sp
)
)
Text(
text = "Monday - Friday Open till 7 Pm",
style = TextStyle(color = Color.Gray)
)
}
}
}
Image(
asset = imageResource(id = Drawables.map),
modifier = Modifier.fillMaxHeight().weight(1f)
)
}
Ash
09/27/2020, 4:37 PM@Preview @Composable
85% of the time does not render anything ... emulator and device work perfect! Anything to be done to make @Preview
work better?Wajahat Karim
09/27/2020, 5:12 PMMark Murphy
09/27/2020, 6:44 PMRadioButtonSample()
from the SDK:
@Composable
fun RadioGroupSample() {
val radioOptions = listOf("Calls", "Missed", "Friends")
val (selectedOption, onOptionSelected) = remember { mutableStateOf(radioOptions[0]) }
Column {
radioOptions.forEach { text ->
Row(Modifier
.fillMaxWidth()
.preferredHeight(56.dp)
.selectable(
selected = (text == selectedOption),
onClick = { onOptionSelected(text) }
)
.padding(horizontal = 16.dp),
verticalAlignment = Alignment.CenterVertically
) {
RadioButton(
selected = (text == selectedOption),
onClick = { onOptionSelected(text) }
)
Text(
text = text,
style = MaterialTheme.typography.body1.merge(),
modifier = Modifier.padding(start = 16.dp)
)
}
}
}
}
It works, including changing the checked state of the RadioButton()
widgets on click events.
This is a refactored version of that sample, pulling the Row()
declaration out into a local function:
@Composable
fun RadioGroupSample() {
val radioOptions = listOf("Calls", "Missed", "Friends")
val (selectedOption, onOptionSelected) = remember { mutableStateOf(radioOptions[0]) }
@Composable
fun RadioRow(text: String) {
Row(Modifier
.fillMaxWidth()
.preferredHeight(56.dp)
.selectable(
selected = (text == selectedOption),
onClick = { onOptionSelected(text) }
)
.padding(horizontal = 16.dp),
verticalAlignment = Alignment.CenterVertically
) {
RadioButton(
selected = (text == selectedOption),
onClick = { onOptionSelected(text) }
)
Text(
text = text,
style = MaterialTheme.typography.body1.merge(),
modifier = Modifier.padding(start = 16.dp)
)
}
}
Column {
radioOptions.forEach { text -> RadioRow(text) }
}
}
It compiles and renders, but the RadioRow()
widgets do not get recomposed when the state changes.