From 060f37aaf0709f9d09f974aa33947bdeea7293a5 Mon Sep 17 00:00:00 2001 From: Kirill Grouchnikov Date: Wed, 5 Jan 2022 15:52:37 -0500 Subject: [PATCH] Wire simple presentation model for the breadcrumb bar content For #8 --- .../aurora/component/AuroraBreadcrumbBar.kt | 27 ++++++++++++++----- .../component/model/BreadcrumbBarModels.kt | 27 +++++++++++++++++++ .../aurora/demo/AuroraBreadcrumbBarDemo.kt | 26 +++++++++++------- 3 files changed, 63 insertions(+), 17 deletions(-) create mode 100644 component/src/desktopMain/kotlin/org/pushingpixels/aurora/component/model/BreadcrumbBarModels.kt diff --git a/component/src/desktopMain/kotlin/org/pushingpixels/aurora/component/AuroraBreadcrumbBar.kt b/component/src/desktopMain/kotlin/org/pushingpixels/aurora/component/AuroraBreadcrumbBar.kt index 61361c7a..f9cf8438 100644 --- a/component/src/desktopMain/kotlin/org/pushingpixels/aurora/component/AuroraBreadcrumbBar.kt +++ b/component/src/desktopMain/kotlin/org/pushingpixels/aurora/component/AuroraBreadcrumbBar.kt @@ -35,10 +35,7 @@ import androidx.compose.ui.unit.dp import kotlinx.coroutines.launch import org.pushingpixels.aurora.common.AuroraInternalApi import org.pushingpixels.aurora.common.withAlpha -import org.pushingpixels.aurora.component.model.ActionFireTrigger -import org.pushingpixels.aurora.component.model.Command -import org.pushingpixels.aurora.component.model.CommandButtonPresentationModel -import org.pushingpixels.aurora.component.model.CommandButtonPresentationState +import org.pushingpixels.aurora.component.model.* import org.pushingpixels.aurora.component.projection.CommandButtonProjection import org.pushingpixels.aurora.component.utils.ArrowSizingConstants import org.pushingpixels.aurora.component.utils.TransitionAwarePainter @@ -48,7 +45,11 @@ import org.pushingpixels.aurora.theming.* @OptIn(AuroraInternalApi::class) @Composable -fun AuroraBreadcrumbBar(commands: List, modifier: Modifier) { +fun AuroraBreadcrumbBar( + commands: List, + presentationModel: BreadcrumbBarPresentationModel = BreadcrumbBarPresentationModel(), + modifier: Modifier +) { val colors = AuroraSkin.colors val decorationAreaType = AuroraSkin.decorationAreaType val density = LocalDensity.current @@ -58,6 +59,9 @@ fun AuroraBreadcrumbBar(commands: List, modifier: Modifier) { val resolvedTextStyle = remember { resolveDefaults(textStyle, layoutDirection) } + // Presentation model for the scroller buttons. Note usage of Original icon filter strategy + // since we're using TransitionAwarePainterDelegate to draw the double arrows, and + // OnRollover action fire trigger for interacting with the scroller buttons. val scrollerPresentationModel = CommandButtonPresentationModel( presentationState = CommandButtonPresentationState.Small, backgroundAppearanceStrategy = BackgroundAppearanceStrategy.Flat, @@ -77,9 +81,13 @@ fun AuroraBreadcrumbBar(commands: List, modifier: Modifier) { resourceLoader = resourceLoader ) + // Presentation model for the content - copy fields from the breadcrumb bar presentation model val contentPresentationModel = CommandButtonPresentationModel( - presentationState = CommandButtonPresentationState.Medium, - backgroundAppearanceStrategy = BackgroundAppearanceStrategy.Flat + presentationState = presentationModel.presentationState, + backgroundAppearanceStrategy = presentationModel.backgroundAppearanceStrategy, + iconActiveFilterStrategy = presentationModel.iconActiveFilterStrategy, + iconEnabledFilterStrategy = presentationModel.iconEnabledFilterStrategy, + iconDisabledFilterStrategy = presentationModel.iconDisabledFilterStrategy ) val contentLayoutManager = contentPresentationModel.presentationState.createLayoutManager( layoutDirection = layoutDirection, @@ -238,6 +246,7 @@ fun AuroraBreadcrumbBar(commands: List, modifier: Modifier) { val contentMeasurable = measurables[1] val rightScrollerMeasurable = measurables[2] + // How big is the left scroller? val leftScrollerPreLayoutInfo = scrollerLayoutManager.getPreLayoutInfo( leftScrollerCommand, @@ -247,6 +256,7 @@ fun AuroraBreadcrumbBar(commands: List, modifier: Modifier) { leftScrollerCommand, scrollerPresentationModel, leftScrollerPreLayoutInfo ) + // How big is the right scroller? val rightScrollerPreLayoutInfo = scrollerLayoutManager.getPreLayoutInfo( rightScrollerCommand, @@ -256,6 +266,7 @@ fun AuroraBreadcrumbBar(commands: List, modifier: Modifier) { rightScrollerCommand, scrollerPresentationModel, rightScrollerPreLayoutInfo ) + // How much space does the scrollable content need? var boxRequiredWidth = 0.0f var boxHeight = 0 for (command in commands) { @@ -271,6 +282,8 @@ fun AuroraBreadcrumbBar(commands: List, modifier: Modifier) { boxHeight = commandSize.height.toInt() } + // Do we need to show the scrollers? If available width from constraints is enough + // to fully display all scrollable content, we don't need to show the scrollers. val needScrollers = (boxRequiredWidth > constraints.maxWidth) val contentWidth = if (needScrollers) constraints.maxWidth - leftScrollerSize.width - rightScrollerSize.width diff --git a/component/src/desktopMain/kotlin/org/pushingpixels/aurora/component/model/BreadcrumbBarModels.kt b/component/src/desktopMain/kotlin/org/pushingpixels/aurora/component/model/BreadcrumbBarModels.kt new file mode 100644 index 00000000..b39be274 --- /dev/null +++ b/component/src/desktopMain/kotlin/org/pushingpixels/aurora/component/model/BreadcrumbBarModels.kt @@ -0,0 +1,27 @@ +/* + * Copyright 2020-2022 Aurora, Kirill Grouchnikov + * + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +package org.pushingpixels.aurora.component.model + +import org.pushingpixels.aurora.theming.BackgroundAppearanceStrategy +import org.pushingpixels.aurora.theming.IconFilterStrategy + +data class BreadcrumbBarPresentationModel( + val presentationState: CommandButtonPresentationState = CommandButtonPresentationState.Medium, + val backgroundAppearanceStrategy: BackgroundAppearanceStrategy = BackgroundAppearanceStrategy.Flat, + val iconActiveFilterStrategy: IconFilterStrategy = IconFilterStrategy.Original, + val iconEnabledFilterStrategy: IconFilterStrategy = IconFilterStrategy.Original, + val iconDisabledFilterStrategy: IconFilterStrategy = IconFilterStrategy.ThemedFollowColorScheme +) : PresentationModel diff --git a/demo/src/desktopMain/kotlin/org/pushingpixels/aurora/demo/AuroraBreadcrumbBarDemo.kt b/demo/src/desktopMain/kotlin/org/pushingpixels/aurora/demo/AuroraBreadcrumbBarDemo.kt index 78bd5c50..1dce5610 100644 --- a/demo/src/desktopMain/kotlin/org/pushingpixels/aurora/demo/AuroraBreadcrumbBarDemo.kt +++ b/demo/src/desktopMain/kotlin/org/pushingpixels/aurora/demo/AuroraBreadcrumbBarDemo.kt @@ -27,9 +27,10 @@ import androidx.compose.ui.window.WindowPlacement import androidx.compose.ui.window.WindowPosition import androidx.compose.ui.window.rememberWindowState import org.pushingpixels.aurora.component.AuroraBreadcrumbBar +import org.pushingpixels.aurora.component.model.BreadcrumbBarPresentationModel import org.pushingpixels.aurora.component.model.Command +import org.pushingpixels.aurora.demo.svg.material.* import org.pushingpixels.aurora.demo.svg.radiance_menu -import org.pushingpixels.aurora.demo.svg.tango.* import org.pushingpixels.aurora.theming.* import org.pushingpixels.aurora.window.AuroraApplicationScope import org.pushingpixels.aurora.window.AuroraDecorationArea @@ -60,15 +61,15 @@ fun main() = auroraApplication { @Composable fun AuroraApplicationScope.BreadcrumbContent(auroraSkinDefinition: MutableState) { val icons = arrayOf( - accessories_text_editor(), - computer(), - drive_harddisk(), - emblem_system(), - font_x_generic(), - help_browser(), - media_floppy(), - preferences_desktop_locale_2(), - user_home() + account_box_24px(), + apps_24px(), + backup_24px(), + devices_other_24px(), + help_24px(), + keyboard_capslock_24px(), + location_on_24px(), + perm_device_information_24px(), + storage_24px() ) val commands = icons.map { Command( @@ -82,6 +83,11 @@ fun AuroraApplicationScope.BreadcrumbContent(auroraSkinDefinition: MutableState< AuroraDecorationArea(decorationAreaType = DecorationAreaType.Header) { AuroraBreadcrumbBar( commands = commands, + presentationModel = BreadcrumbBarPresentationModel( + iconActiveFilterStrategy = IconFilterStrategy.ThemedFollowText, + iconEnabledFilterStrategy = IconFilterStrategy.ThemedFollowText, + iconDisabledFilterStrategy = IconFilterStrategy.ThemedFollowText + ), modifier = Modifier.fillMaxWidth().auroraBackground() .padding(horizontal = 2.dp, vertical = 4.dp) )