Skip to content

Commit 93ba05c

Browse files
demolafdemolaf
committed
fix: use screen width for adaptive padding values
1 parent bfd056c commit 93ba05c

File tree

2 files changed

+78
-66
lines changed

2 files changed

+78
-66
lines changed

‎auth/src/main/java/com/firebase/ui/auth/compose/ui/components/AuthProviderButton.kt‎

Lines changed: 3 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -21,6 +21,7 @@ import androidx.compose.ui.Alignment
2121
import androidx.compose.ui.Modifier
2222
import androidx.compose.ui.graphics.Color
2323
import androidx.compose.ui.platform.LocalContext
24+
import androidx.compose.ui.text.style.TextAlign
2425
import androidx.compose.ui.text.style.TextOverflow
2526
import androidx.compose.ui.tooling.preview.Preview
2627
import androidx.compose.ui.unit.dp
@@ -69,8 +70,7 @@ fun AuthProviderButton(
6970
val providerLabel = resolveProviderLabel(provider, stringProvider)
7071

7172
Button(
72-
modifier = modifier
73-
.width(208.dp),
73+
modifier = modifier,
7474
contentPadding = PaddingValues(horizontal = 12.dp),
7575
colors = ButtonDefaults.buttonColors(
7676
containerColor = providerStyle.backgroundColor,
@@ -84,8 +84,7 @@ fun AuthProviderButton(
8484
enabled = enabled,
8585
) {
8686
Row(
87-
modifier = Modifier
88-
.fillMaxWidth(),
87+
modifier = modifier,
8988
verticalAlignment = Alignment.CenterVertically,
9089
horizontalArrangement = Arrangement.Start
9190
) {

‎auth/src/main/java/com/firebase/ui/auth/compose/ui/method_picker/AuthMethodPicker.kt‎

Lines changed: 75 additions & 62 deletions
Original file line numberDiff line numberDiff line change
@@ -2,11 +2,14 @@ package com.firebase.ui.auth.compose.ui.method_picker
22

33
import androidx.compose.foundation.Image
44
import androidx.compose.foundation.layout.Box
5+
import androidx.compose.foundation.layout.BoxWithConstraints
56
import androidx.compose.foundation.layout.Column
67
import androidx.compose.foundation.layout.fillMaxSize
8+
import androidx.compose.foundation.layout.fillMaxWidth
79
import androidx.compose.foundation.layout.padding
810
import androidx.compose.foundation.layout.safeDrawingPadding
911
import androidx.compose.foundation.lazy.LazyColumn
12+
import androidx.compose.foundation.lazy.itemsIndexed
1013
import androidx.compose.runtime.Composable
1114
import androidx.compose.ui.Alignment
1215
import androidx.compose.ui.Modifier
@@ -61,14 +64,12 @@ fun AuthMethodPicker(
6164

6265
Column(
6366
modifier = modifier
64-
.fillMaxSize()
65-
.safeDrawingPadding(),
66-
horizontalAlignment = Alignment.CenterHorizontally
6767
) {
6868
logo?.let {
6969
Image(
7070
modifier = Modifier
71-
.weight(0.4f),
71+
.weight(0.4f)
72+
.align(Alignment.CenterHorizontally),
7273
painter = it.painter,
7374
contentDescription = if (inPreview) ""
7475
else stringResource(R.string.fui_auth_method_picker_logo)
@@ -77,26 +78,33 @@ fun AuthMethodPicker(
7778
if (customLayout != null) {
7879
customLayout(providers, onProviderSelected)
7980
} else {
80-
LazyColumn(
81+
BoxWithConstraints(
8182
modifier = Modifier
82-
.fillMaxSize()
83-
.weight(1f)
84-
.testTag("AuthMethodPicker LazyColumn"),
85-
horizontalAlignment = Alignment.CenterHorizontally,
83+
.weight(1f),
8684
) {
87-
items(providers.size) { index ->
88-
val provider = providers[index]
89-
Box(
90-
modifier = Modifier
91-
.padding(bottom = 16.dp)
92-
) {
93-
AuthProviderButton(
94-
onClick = {
95-
onProviderSelected(provider)
96-
},
97-
provider = provider,
98-
stringProvider = DefaultAuthUIStringProvider(context)
99-
)
85+
val paddingWidth = maxWidth.value * 0.23
86+
LazyColumn(
87+
modifier = Modifier
88+
.fillMaxSize()
89+
.padding(horizontal = paddingWidth.dp)
90+
.testTag("AuthMethodPicker LazyColumn"),
91+
horizontalAlignment = Alignment.CenterHorizontally,
92+
) {
93+
itemsIndexed(providers) { index, provider ->
94+
Box(
95+
modifier = Modifier
96+
.padding(bottom = if (index < providers.lastIndex) 16.dp else 0.dp)
97+
) {
98+
AuthProviderButton(
99+
modifier = Modifier
100+
.fillMaxWidth(),
101+
onClick = {
102+
onProviderSelected(provider)
103+
},
104+
provider = provider,
105+
stringProvider = DefaultAuthUIStringProvider(context)
106+
)
107+
}
100108
}
101109
}
102110
}
@@ -118,46 +126,51 @@ fun AuthMethodPicker(
118126
@Preview(showBackground = true)
119127
@Composable
120128
fun PreviewAuthMethodPicker() {
121-
AuthMethodPicker(
122-
providers = listOf(
123-
AuthProvider.Email(
124-
actionCodeSettings = null,
125-
passwordValidationRules = emptyList()
126-
),
127-
AuthProvider.Phone(
128-
defaultNumber = null,
129-
defaultCountryCode = null,
130-
allowedCountries = null,
131-
),
132-
AuthProvider.Google(
133-
scopes = emptyList(),
134-
serverClientId = null
135-
),
136-
AuthProvider.Facebook(),
137-
AuthProvider.Twitter(
138-
customParameters = emptyMap()
139-
),
140-
AuthProvider.Github(
141-
customParameters = emptyMap()
142-
),
143-
AuthProvider.Microsoft(
144-
tenant = null,
145-
customParameters = emptyMap()
146-
),
147-
AuthProvider.Yahoo(
148-
customParameters = emptyMap()
149-
),
150-
AuthProvider.Apple(
151-
locale = null,
152-
customParameters = emptyMap()
129+
Column(
130+
modifier = Modifier
131+
.fillMaxSize()
132+
) {
133+
AuthMethodPicker(
134+
providers = listOf(
135+
AuthProvider.Email(
136+
actionCodeSettings = null,
137+
passwordValidationRules = emptyList()
138+
),
139+
AuthProvider.Phone(
140+
defaultNumber = null,
141+
defaultCountryCode = null,
142+
allowedCountries = null,
143+
),
144+
AuthProvider.Google(
145+
scopes = emptyList(),
146+
serverClientId = null
147+
),
148+
AuthProvider.Facebook(),
149+
AuthProvider.Twitter(
150+
customParameters = emptyMap()
151+
),
152+
AuthProvider.Github(
153+
customParameters = emptyMap()
154+
),
155+
AuthProvider.Microsoft(
156+
tenant = null,
157+
customParameters = emptyMap()
158+
),
159+
AuthProvider.Yahoo(
160+
customParameters = emptyMap()
161+
),
162+
AuthProvider.Apple(
163+
locale = null,
164+
customParameters = emptyMap()
165+
),
166+
AuthProvider.Anonymous,
153167
),
154-
AuthProvider.Anonymous,
155-
),
156-
logo = AuthUIAsset.Resource(R.drawable.fui_ic_check_circle_black_128dp),
157-
onProviderSelected = { provider ->
168+
logo = AuthUIAsset.Resource(R.drawable.fui_ic_check_circle_black_128dp),
169+
onProviderSelected = { provider ->
158170

159-
},
160-
termsOfServiceUrl = "https://example.com/terms",
161-
privacyPolicyUrl = "https://example.com/privacy"
162-
)
171+
},
172+
termsOfServiceUrl = "https://example.com/terms",
173+
privacyPolicyUrl = "https://example.com/privacy"
174+
)
175+
}
163176
}

0 commit comments

Comments
 (0)