Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Original file line number Diff line number Diff line change
Expand Up @@ -36,8 +36,6 @@ import androidx.compose.ui.graphics.vector.ImageVector
import androidx.compose.ui.graphics.vector.rememberVectorPainter
import androidx.compose.ui.layout.ContentScale
import androidx.compose.ui.res.vectorResource
import androidx.compose.ui.tooling.preview.Devices.PIXEL_TABLET
import androidx.compose.ui.tooling.preview.Preview
import androidx.compose.ui.unit.IntOffset
import androidx.compose.ui.unit.dp
import com.android.developers.androidify.theme.AndroidifyTheme
Expand Down Expand Up @@ -80,31 +78,6 @@ fun SquiggleBackground(
}
}

/**
* Background squiggle that tries to fit in its parent.
*/
@Composable
fun SquiggleBackgroundFull() {
val vectorBackground =
rememberVectorPainter(ImageVector.vectorResource(R.drawable.squiggle_full))
Box(modifier = Modifier.fillMaxSize()) {
Image(
painter = vectorBackground,
contentDescription = null,
modifier = Modifier.fillMaxSize(),
contentScale = ContentScale.Fit,
)
}
}

@Preview(device = PIXEL_TABLET)
@Composable
fun SquiggleFullImagePreview() {
AndroidifyTheme {
SquiggleBackgroundFull()
}
}

@LargeScreensPreview
@Composable
private fun SquiggleBackgroundLargePreview() {
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -15,7 +15,19 @@
*/
package com.android.developers.androidify.xr

import androidx.annotation.DrawableRes
import androidx.compose.foundation.Image
import androidx.compose.foundation.layout.Box
import androidx.compose.foundation.layout.fillMaxSize
import androidx.compose.runtime.Composable
import androidx.compose.ui.Modifier
import androidx.compose.ui.graphics.vector.ImageVector
import androidx.compose.ui.graphics.vector.rememberVectorPainter
import androidx.compose.ui.layout.ContentScale
import androidx.compose.ui.res.vectorResource
import androidx.compose.ui.tooling.preview.Devices.PIXEL_TABLET
import androidx.compose.ui.tooling.preview.Preview
import androidx.compose.ui.unit.Dp
import androidx.compose.ui.unit.dp
import androidx.xr.compose.spatial.Subspace
import androidx.xr.compose.subspace.SpatialBox
Expand All @@ -24,11 +36,13 @@ import androidx.xr.compose.subspace.SpatialPanel
import androidx.xr.compose.subspace.SubspaceComposable
import androidx.xr.compose.subspace.layout.SubspaceModifier
import androidx.xr.compose.subspace.layout.aspectRatio
import androidx.xr.compose.subspace.layout.fillMaxSize
import androidx.xr.compose.subspace.layout.fillMaxWidth
import androidx.xr.compose.subspace.layout.movable
import androidx.xr.compose.subspace.layout.offset
import androidx.xr.compose.subspace.layout.resizable
import com.android.developers.androidify.theme.components.SquiggleBackgroundFull
import androidx.xr.compose.unit.DpVolumeSize
import com.android.developers.androidify.theme.AndroidifyTheme

/**
* A composable for a Subspace with a Squiggle background.
Expand All @@ -37,6 +51,24 @@ import com.android.developers.androidify.theme.components.SquiggleBackgroundFull
*/
@Composable
fun SquiggleBackgroundSubspace(
minimumHeight: Dp,
content:
@SubspaceComposable @Composable
SpatialBoxScope.() -> Unit,
) {
BackgroundSubspace(
aspectRatio = 1.7f,
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

medium

The aspect ratio 1.7f is a hardcoded value. Consider extracting it into a named constant to improve readability and make it easier to manage, especially if this value is used elsewhere or might change.

drawable = R.drawable.squiggle_full,
minimumHeight = minimumHeight,
content = content,
)
}

@Composable
fun BackgroundSubspace(
aspectRatio: Float,
@DrawableRes drawable: Int,
minimumHeight: Dp,
content:
@SubspaceComposable @Composable
SpatialBoxScope.() -> Unit,
Expand All @@ -45,14 +77,42 @@ fun SquiggleBackgroundSubspace(
SpatialPanel(
SubspaceModifier
.movable()
.resizable()
.fillMaxWidth(1f)
.aspectRatio(1.7f),
.resizable(
minimumSize = DpVolumeSize(0.dp, minimumHeight, 0.dp),
maintainAspectRatio = true,
)
.fillMaxWidth()
.aspectRatio(aspectRatio),
) {
SquiggleBackgroundFull()
FillBackground(drawable)
Subspace {
SpatialBox(SubspaceModifier.offset(z = 10.dp), content = content)
SpatialBox(SubspaceModifier.offset(z = 10.dp).fillMaxSize(), content = content)
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

medium

The z-offset 10.dp is a magic number. It's good practice to define such values as named constants (e.g., private val CONTENT_Z_OFFSET = 10.dp) to clarify their purpose (e.g., preventing z-fighting) and make them easier to find and update.

}
}
}
}

/**
* Background squiggle that tries to fit in its parent.
*/
@Composable
fun FillBackground(@DrawableRes drawable: Int) {
val vectorBackground =
rememberVectorPainter(ImageVector.vectorResource(drawable))
Box(modifier = Modifier.fillMaxSize()) {
Image(
painter = vectorBackground,
contentDescription = null,
modifier = Modifier.fillMaxSize(),
contentScale = ContentScale.Fit,
)
}
}

@Preview(device = PIXEL_TABLET)
@Composable
fun SquiggleFullImagePreview() {
AndroidifyTheme {
FillBackground(R.drawable.squiggle_full)
}
}
Original file line number Diff line number Diff line change
Expand Up @@ -303,7 +303,7 @@ class CreationScreenTest {

composeTestRule.setContent {
SharedElementContextPreview {
LoadingScreen(onCancelPress = {})
LoadingScreen(onCancelPress = {}, layoutType = EditScreenLayoutType.Medium)
}
}

Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -99,6 +99,7 @@ fun CreationScreen(
onCancelPress = {
creationViewModel.cancelInProgressTask()
},
layoutType = layoutType,
)
}
}
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -48,6 +48,7 @@ import androidx.compose.runtime.setValue
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.draw.paint
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.graphics.SolidColor
import androidx.compose.ui.graphics.StrokeCap
import androidx.compose.ui.graphics.graphicsLayer
Expand All @@ -70,25 +71,48 @@ import androidx.compose.ui.tooling.preview.Devices.PIXEL_3A_XL
import androidx.compose.ui.tooling.preview.Preview
import androidx.compose.ui.tooling.preview.PreviewScreenSizes
import androidx.compose.ui.unit.dp
import com.android.developers.androidify.creation.xr.LoadingScreenSpatial
import com.android.developers.androidify.theme.AndroidifyTheme
import com.android.developers.androidify.theme.components.AndroidifyTopAppBar
import com.android.developers.androidify.theme.components.PrimaryButton
import com.android.developers.androidify.util.LargeScreensPreview
import com.android.developers.androidify.util.SmallPhonePreview
import com.android.developers.androidify.util.isAtLeastMedium
import kotlinx.coroutines.delay
import kotlin.math.roundToInt
import com.android.developers.androidify.creation.R as CreationR

@Composable
fun LoadingScreen(
onCancelPress: () -> Unit,
isMediumScreen: Boolean = isAtLeastMedium(),
layoutType: EditScreenLayoutType,
) {
when (layoutType) {
EditScreenLayoutType.Spatial ->
LoadingScreenSpatial(
onCancelPress = onCancelPress,
)

EditScreenLayoutType.Compact, EditScreenLayoutType.Medium ->
LoadingScreenScaffold(
topBar = {
AndroidifyTopAppBar(isMediumWindowSize = layoutType == EditScreenLayoutType.Medium)
},
onCancelPress = onCancelPress,
) { contentPadding ->
LoadingScreenContents(contentPadding)
}
}
}

@Composable
fun LoadingScreenScaffold(
topBar: @Composable () -> Unit,
onCancelPress: () -> Unit,
containerColor: Color = MaterialTheme.colorScheme.secondary,
content: @Composable (PaddingValues) -> Unit,
) {
Scaffold(
topBar = {
AndroidifyTopAppBar(isMediumWindowSize = isMediumScreen)
},
topBar = topBar,
bottomBar = {
Box(
modifier = Modifier
Expand All @@ -105,19 +129,16 @@ fun LoadingScreen(
)
}
},
containerColor = MaterialTheme.colorScheme.secondary,
containerColor = containerColor,
modifier = Modifier
.fillMaxSize()
.keepScreenOn(),
) { contentPadding ->
LoadingScreenContents(contentPadding)
}
content = content,
)
}

@Composable
private fun LoadingScreenContents(
contentPadding: PaddingValues,
) {
fun LoadingScreenContents(contentPadding: PaddingValues) {
Column(
modifier = Modifier
.fillMaxSize()
Expand Down Expand Up @@ -202,7 +223,7 @@ private fun BoxScope.DecorativeSparkleDarkGreen(modifier: Modifier = Modifier) {
@Composable
fun LoadingScreenLargePreview() {
AndroidifyTheme {
LoadingScreen(onCancelPress = {})
LoadingScreen(onCancelPress = {}, layoutType = EditScreenLayoutType.Medium)
}
}

Expand All @@ -212,7 +233,7 @@ fun LoadingScreenLargePreview() {
@Composable
fun LoadingScreenPreview() {
AndroidifyTheme {
LoadingScreen(onCancelPress = {}, isMediumScreen = false)
LoadingScreen(onCancelPress = {}, layoutType = EditScreenLayoutType.Compact)
}
}

Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -75,7 +75,7 @@ fun EditScreenSpatial(
onDropCallback: (Uri) -> Unit = {},
) {
DisableSharedTransition {
SquiggleBackgroundSubspace {
SquiggleBackgroundSubspace(minimumHeight = 600.dp) {
MainPanelWorkaround()
SpatialColumn(SubspaceModifier.fillMaxWidth()) {
SpatialPanel(
Expand Down
Original file line number Diff line number Diff line change
@@ -0,0 +1,115 @@
/*
* Copyright 2025 The Android Open Source Project
*
* 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
*
* https://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 com.android.developers.androidify.creation.xr

import androidx.compose.foundation.layout.Box
import androidx.compose.foundation.layout.fillMaxHeight
import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.layout.size
import androidx.compose.material3.IconButtonDefaults
import androidx.compose.material3.MaterialTheme
import androidx.compose.runtime.Composable
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.unit.dp
import androidx.xr.compose.spatial.ContentEdge
import androidx.xr.compose.spatial.Orbiter
import androidx.xr.compose.spatial.OrbiterOffsetType
import androidx.xr.compose.subspace.SpatialPanel
import androidx.xr.compose.subspace.layout.SubspaceModifier
import androidx.xr.compose.subspace.layout.fillMaxHeight
import androidx.xr.compose.subspace.layout.fillMaxWidth
import androidx.xr.compose.subspace.layout.offset
import com.android.developers.androidify.creation.LoadingScreenContents
import com.android.developers.androidify.creation.LoadingScreenScaffold
import com.android.developers.androidify.theme.AndroidifyTheme
import com.android.developers.androidify.util.TabletPreview
import com.android.developers.androidify.xr.BackgroundSubspace
import com.android.developers.androidify.xr.FillBackground
import com.android.developers.androidify.xr.MainPanelWorkaround
import com.android.developers.androidify.xr.RequestHomeSpaceIconButton
import com.android.developers.androidify.creation.R as CreationR

private const val squiggleSafeContentWidth = 0.4f
private const val squiggleSafeContentHeight = 0.6f

@Composable
fun LoadingScreenSpatial(
onCancelPress: () -> Unit,
) {
BackgroundSubspace(
aspectRatio = 1.4f,
minimumHeight = 500.dp,
drawable = CreationR.drawable.squiggle_light,
) {
MainPanelWorkaround()
Orbiter(
position = ContentEdge.Top,
offsetType = OrbiterOffsetType.OuterEdge,
offset = 32.dp,
alignment = Alignment.End,
) {
RequestHomeSpaceIconButton(
modifier = Modifier
.size(64.dp, 64.dp)
.padding(8.dp),
colors = IconButtonDefaults.iconButtonColors(
containerColor = MaterialTheme.colorScheme.secondaryContainer,
),
)
}
SpatialPanel(
SubspaceModifier
.fillMaxWidth(squiggleSafeContentWidth)
.fillMaxHeight(squiggleSafeContentHeight)
.offset(z = 10.dp),
) {
LoadingScreenScaffold(
topBar = {},
onCancelPress = onCancelPress,
containerColor = Color.Transparent,
) { contentPadding ->
LoadingScreenContents(contentPadding)
}
}
}
}

@TabletPreview
@Composable
private fun LoadingScreenSpatialPreview() {
AndroidifyTheme {
Box {
FillBackground(CreationR.drawable.squiggle_light)
Box(
Modifier
.fillMaxHeight(squiggleSafeContentHeight)
.fillMaxWidth(squiggleSafeContentWidth)
.align(Alignment.Center),
) {
LoadingScreenScaffold(
topBar = {},
onCancelPress = { },
containerColor = Color.Transparent,
) { contentPadding ->
LoadingScreenContents(contentPadding)
}
}
}
}
}
Loading