@@ -2,11 +2,13 @@ package com.firebase.ui.auth.compose.ui.method_picker
2
2
3
3
import androidx.compose.foundation.Image
4
4
import androidx.compose.foundation.layout.Box
5
+ import androidx.compose.foundation.layout.BoxWithConstraints
5
6
import androidx.compose.foundation.layout.Column
6
7
import androidx.compose.foundation.layout.fillMaxSize
8
+ import androidx.compose.foundation.layout.fillMaxWidth
7
9
import androidx.compose.foundation.layout.padding
8
- import androidx.compose.foundation.layout.safeDrawingPadding
9
10
import androidx.compose.foundation.lazy.LazyColumn
11
+ import androidx.compose.foundation.lazy.itemsIndexed
10
12
import androidx.compose.runtime.Composable
11
13
import androidx.compose.ui.Alignment
12
14
import androidx.compose.ui.Modifier
@@ -17,7 +19,7 @@ import androidx.compose.ui.res.stringResource
17
19
import androidx.compose.ui.tooling.preview.Preview
18
20
import androidx.compose.ui.unit.dp
19
21
import com.firebase.ui.auth.R
20
- import com.firebase.ui.auth.compose.configuration.auth_provider. AuthProvider
22
+ import com.firebase.ui.auth.compose.configuration.AuthProvider
21
23
import com.firebase.ui.auth.compose.configuration.string_provider.DefaultAuthUIStringProvider
22
24
import com.firebase.ui.auth.compose.configuration.theme.AuthUIAsset
23
25
import com.firebase.ui.auth.compose.ui.components.AuthProviderButton
@@ -29,8 +31,8 @@ import com.firebase.ui.auth.compose.ui.components.AuthProviderButton
29
31
* ```kotlin
30
32
* AuthMethodPicker(
31
33
* providers = listOf(
32
- * AuthProvider.Google(),
33
- * AuthProvider.Email(),
34
+ * AuthProvider.Google(),
35
+ * AuthProvider.Email(),
34
36
* ),
35
37
* onProviderSelected = { provider -> /* ... */ }
36
38
* )
@@ -61,14 +63,12 @@ fun AuthMethodPicker(
61
63
62
64
Column (
63
65
modifier = modifier
64
- .fillMaxSize()
65
- .safeDrawingPadding(),
66
- horizontalAlignment = Alignment .CenterHorizontally
67
66
) {
68
67
logo?.let {
69
68
Image (
70
69
modifier = Modifier
71
- .weight(0.4f ),
70
+ .weight(0.4f )
71
+ .align(Alignment .CenterHorizontally ),
72
72
painter = it.painter,
73
73
contentDescription = if (inPreview) " "
74
74
else stringResource(R .string.fui_auth_method_picker_logo)
@@ -77,26 +77,32 @@ fun AuthMethodPicker(
77
77
if (customLayout != null ) {
78
78
customLayout(providers, onProviderSelected)
79
79
} else {
80
- LazyColumn (
80
+ BoxWithConstraints (
81
81
modifier = Modifier
82
- .fillMaxSize()
83
- .weight(1f )
84
- .testTag(" AuthMethodPicker LazyColumn" ),
85
- horizontalAlignment = Alignment .CenterHorizontally ,
82
+ .weight(1f ),
86
83
) {
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
- )
84
+ val paddingWidth = maxWidth.value * 0.23
85
+ LazyColumn (
86
+ modifier = Modifier
87
+ .padding(horizontal = paddingWidth.dp)
88
+ .testTag(" AuthMethodPicker LazyColumn" ),
89
+ horizontalAlignment = Alignment .CenterHorizontally ,
90
+ ) {
91
+ itemsIndexed(providers) { index, provider ->
92
+ Box (
93
+ modifier = Modifier
94
+ .padding(bottom = if (index < providers.lastIndex) 16 .dp else 0 .dp)
95
+ ) {
96
+ AuthProviderButton (
97
+ modifier = Modifier
98
+ .fillMaxWidth(),
99
+ onClick = {
100
+ onProviderSelected(provider)
101
+ },
102
+ provider = provider,
103
+ stringProvider = DefaultAuthUIStringProvider (context)
104
+ )
105
+ }
100
106
}
101
107
}
102
108
}
@@ -118,46 +124,51 @@ fun AuthMethodPicker(
118
124
@Preview(showBackground = true )
119
125
@Composable
120
126
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()
127
+ Column (
128
+ modifier = Modifier
129
+ .fillMaxSize()
130
+ ) {
131
+ AuthMethodPicker (
132
+ providers = listOf (
133
+ AuthProvider .Email (
134
+ actionCodeSettings = null ,
135
+ passwordValidationRules = emptyList()
136
+ ),
137
+ AuthProvider .Phone (
138
+ defaultNumber = null ,
139
+ defaultCountryCode = null ,
140
+ allowedCountries = null ,
141
+ ),
142
+ AuthProvider .Google (
143
+ scopes = emptyList(),
144
+ serverClientId = null
145
+ ),
146
+ AuthProvider .Facebook (),
147
+ AuthProvider .Twitter (
148
+ customParameters = emptyMap()
149
+ ),
150
+ AuthProvider .Github (
151
+ customParameters = emptyMap()
152
+ ),
153
+ AuthProvider .Microsoft (
154
+ tenant = null ,
155
+ customParameters = emptyMap()
156
+ ),
157
+ AuthProvider .Yahoo (
158
+ customParameters = emptyMap()
159
+ ),
160
+ AuthProvider .Apple (
161
+ locale = null ,
162
+ customParameters = emptyMap()
163
+ ),
164
+ AuthProvider .Anonymous ,
153
165
),
154
- AuthProvider .Anonymous ,
155
- ),
156
- logo = AuthUIAsset .Resource (R .drawable.fui_ic_check_circle_black_128dp),
157
- onProviderSelected = { provider ->
166
+ logo = AuthUIAsset .Resource (R .drawable.fui_ic_check_circle_black_128dp),
167
+ onProviderSelected = { provider ->
158
168
159
- },
160
- termsOfServiceUrl = " https://example.com/terms" ,
161
- privacyPolicyUrl = " https://example.com/privacy"
162
- )
169
+ },
170
+ termsOfServiceUrl = " https://example.com/terms" ,
171
+ privacyPolicyUrl = " https://example.com/privacy"
172
+ )
173
+ }
163
174
}
0 commit comments