MFlisar / ComposePreferences

Compose Preference Screen for Android - Material3 Design (including customisation, nesting and more)
Apache License 2.0
8 stars 0 forks source link

Preferences dialog styles #7

Open KarolCieslar opened 2 months ago

KarolCieslar commented 2 months ago

How i can change default dialogs colors, title, description for specific preferences?

MFlisar commented 2 months ago

The preferences take composables for title and subtitle so you can style them in there freely...

Regarding dialogs, I don't provide a dialog here just a simple composable... so what do you mean here in particular?

KarolCieslar commented 2 months ago

Thanks for reply. I want to customize this dialog Screenshot_7

MFlisar commented 2 months ago

I do use my ComposeDialogs library for the internal dialogs - I do not expose a lot of customisation options for the dialogs to keep this library simple and independent from the the dialogs library.

You have 2 options:

Option 1

Create a custom preference based on the PreferenceInputText and adjust the underlying ComposeDialogs directly.

https://github.com/MFlisar/ComposePreferences/blob/e4ec46bfae09217e47cba787375c2957a59f4760/library/modules/screen/input/src/main/java/com/michaelflisar/composepreferences/screen/input/PreferenceInputText.kt#L72-L114

E.g. like following:

val showDialog = rememberDialogState() 
if (showDialog.showing) { 
   val value = rememberDialogInput(value) 
   DialogInput( 
       state = showDialog, 
       input = value, 
       title = title, // <= provide a custom title composable here...
       icon = icon 
   ) { 
       if (it.isPositiveButton) { 
           onValueChange(value.value) 
       } 
   } 
} 
BasePreference( 
   enabled = enabled, 
   visible = visible, 
   title = title, 
   subtitle = subtitle, 
   icon = icon, 
   preferenceStyle = preferenceStyle, 
   itemSetup = itemSetup, 
   onClick = { 
       showDialog.show() 
   } 
) { 
   PreferenceContentText(value, itemSetup) 
}

Option 2 - create a custom preference and provide your own dialog

BasePreference( 
   enabled = enabled, 
   visible = visible, 
   title = title, 
   subtitle = subtitle, 
   icon = icon, 
   preferenceStyle = preferenceStyle, 
   itemSetup = itemSetup, 
   onClick = { 
      // show a dialog
   } 
) { 
   PreferenceContentText(value, itemSetup) 
}

// TODO: show a fully custom dialog

Because of the simplicity of any dialog based preference I do not plan to offer more customisation for the dialogs currently.

KarolCieslar commented 2 months ago

In my opinion ComposeDialogs should had simple customization for example Title (as @Composable function) Description (as @Composable function) Enable/Disable icon Background color Cornders shape Buttons (as @Composable funciton)

These configuration give simple things to customize dialog and repository is still langweight

MFlisar commented 2 months ago

Check out the dialog code here:

https://github.com/MFlisar/ComposeDialogs/blob/53435e92b4e56d158cd5fe5354f142d9c45d739d/library/modules/input/src/main/java/com/michaelflisar/composedialogs/dialogs/input/DialogInput.kt#L64-L93

There is a lot to customise... BUT I could offer a parameter that will allow you to provide your dialog directly, with a default implementation that you can overwrite, something like following:

@Composable
fun PreferenceScope.PreferenceInputText(
    // Special
    value: String,
    onValueChange: (value: String) -> Unit,
    // Base Preference
    title: @Composable () -> Unit,
    enabled: Dependency = Dependency.Enabled,
    visible: Dependency = Dependency.Enabled,
    subtitle: @Composable (() -> Unit)? = null,
    icon: (@Composable () -> Unit)? = null,
    preferenceStyle: PreferenceStyle = LocalPreferenceSettings.current.itemStyle,
    itemSetup: PreferenceItemSetup = PreferenceBoolDefaults.itemSetup(),
    // Dialog
    dialog: @Composable (dialogState: DialogState) -> Unit = { dialogState ->
        val value = rememberDialogInput(value)
        DialogInput(
            state = dialogState,
            input = value,
            title = title,
            icon = icon
        ) {
            if (it.isPositiveButton) {
                onValueChange(value.value)
            }
        }
    }
)

This way you could use all of the customisation options of my dialog libraries directly...

These configuration give simple things to customize dialog and repository is still langweight

What I meant here is that I do not want to copy the configuration options from my dialog library into this library and make the composable functions even more overloaded than they already are. Above suggestion would be an option though.

KarolCieslar commented 2 months ago

Sounds good. I will be grateful if You could make these changes.

KarolCieslar commented 2 months ago

When can i expect update?