Sulkta-OSS/element-x-ada
2
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Improve preview for OutlinedTextField and TextField

Browse source
This commit is contained in:
Benoit Marty 2023-02-15 12:57:08 +01:00
parent 80557924bd
commit 6a534e7536
7 changed files with 75 additions and 18 deletions
Download patch file Download diff file Expand all files Collapse all files

31
libraries/designsystem/src/main/kotlin/io/element/android/libraries/designsystem/theme/components/OutlinedTextField.kt
View file

@ -18,6 +18,9 @@ package io.element.android.libraries.designsystem.theme.components
import androidx.compose.foundation.interaction.MutableInteractionSource
import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.Spacer
import androidx.compose.foundation.layout.height
import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.text.KeyboardActions
import androidx.compose.foundation.text.KeyboardOptions
import androidx.compose.material3.ExperimentalMaterial3Api
@ -31,8 +34,11 @@ import androidx.compose.ui.graphics.Shape
import androidx.compose.ui.text.TextStyle
import androidx.compose.ui.text.input.VisualTransformation
import androidx.compose.ui.tooling.preview.Preview
import androidx.compose.ui.unit.dp
import io.element.android.libraries.designsystem.preview.ElementPreviewDark
import io.element.android.libraries.designsystem.preview.ElementPreviewLight
import io.element.android.libraries.designsystem.utils.allBooleans
import io.element.android.libraries.designsystem.utils.asInt
@OptIn(ExperimentalMaterial3Api::class)
@Composable
@ -92,14 +98,21 @@ internal fun OutlinedTextFieldsDarkPreview() = ElementPreviewDark { ContentToPre
@Composable
private fun ContentToPreview() {
Column {
OutlinedTextField(onValueChange = {}, value = "Content", isError = false, enabled = true, readOnly = true)
OutlinedTextField(onValueChange = {}, value = "Content", isError = false, enabled = true, readOnly = false)
OutlinedTextField(onValueChange = {}, value = "Content", isError = false, enabled = false, readOnly = true)
OutlinedTextField(onValueChange = {}, value = "Content", isError = false, enabled = false, readOnly = false)
OutlinedTextField(onValueChange = {}, value = "Content", isError = true, enabled = true, readOnly = true)
OutlinedTextField(onValueChange = {}, value = "Content", isError = true, enabled = true, readOnly = false)
OutlinedTextField(onValueChange = {}, value = "Content", isError = true, enabled = false, readOnly = true)
OutlinedTextField(onValueChange = {}, value = "Content", isError = true, enabled = false, readOnly = false)
Column(modifier = Modifier.padding(4.dp)) {
allBooleans.forEach { isError ->
allBooleans.forEach { enabled ->
allBooleans.forEach { readonly ->
OutlinedTextField(
onValueChange = {},
label = { Text(text = "label") },
value = "Hello er=${isError.asInt()}, en=${enabled.asInt()}, ro=${readonly.asInt()}",
isError = isError,
enabled = enabled,
readOnly = readonly,
)
Spacer(modifier = Modifier.height(2.dp))
}
}
}
}
}

25
libraries/designsystem/src/main/kotlin/io/element/android/libraries/designsystem/theme/components/TextField.kt
View file

@ -17,6 +17,10 @@
package io.element.android.libraries.designsystem.theme.components
import androidx.compose.foundation.interaction.MutableInteractionSource
import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.Spacer
import androidx.compose.foundation.layout.height
import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.text.KeyboardActions
import androidx.compose.foundation.text.KeyboardOptions
import androidx.compose.material3.ExperimentalMaterial3Api
@ -30,8 +34,11 @@ import androidx.compose.ui.graphics.Shape
import androidx.compose.ui.text.TextStyle
import androidx.compose.ui.text.input.VisualTransformation
import androidx.compose.ui.tooling.preview.Preview
import androidx.compose.ui.unit.dp
import io.element.android.libraries.designsystem.preview.ElementPreviewDark
import io.element.android.libraries.designsystem.preview.ElementPreviewLight
import io.element.android.libraries.designsystem.utils.allBooleans
import io.element.android.libraries.designsystem.utils.asInt
@OptIn(ExperimentalMaterial3Api::class)
@Composable
@ -93,5 +100,21 @@ internal fun TextFieldDarkPreview() =
@Composable
private fun ContentToPreview() {
TextField(value = "Hello", onValueChange = {})
Column(modifier = Modifier.padding(4.dp)) {
allBooleans.forEach { isError ->
allBooleans.forEach { enabled ->
allBooleans.forEach { readonly ->
TextField(
onValueChange = {},
label = { Text(text = "label") },
value = "Hello er=${isError.asInt()}, en=${enabled.asInt()}, ro=${readonly.asInt()}",
isError = isError,
enabled = enabled,
readOnly = readonly,
)
Spacer(modifier = Modifier.height(2.dp))
}
}
}
}
}

21
libraries/designsystem/src/main/kotlin/io/element/android/libraries/designsystem/utils/Extensions.kt Normal file
View file

@ -0,0 +1,21 @@
/*
* Copyright (c) 2023 New Vector Ltd
*
* 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 io.element.android.libraries.designsystem.utils
internal fun Boolean.asInt(): Int = if (this) 1 else 0
val allBooleans = listOf(false, true)

4
tests/uitests/src/test/snapshots/images/io.element.android.tests.uitests_ScreenshotTest_preview_tests[io.element.android.libraries.designsystem.theme.components_null_DefaultGroup_OutlinedTextFieldsDarkPreview_0_null,NEXUS_5,1,en].png
View file

@ -1,3 +1,3 @@
version https://git-lfs.github.com/spec/v1
oid sha256:e842ff561687f991106043a4f6b51455bd917db879ef1d624bd59df155ac61dd
size 21932
oid sha256:a341207d89b9d841068b1b0d378de75c14abfa5f413fd07238cd125f62cf0b2b
size 42348

4
tests/uitests/src/test/snapshots/images/io.element.android.tests.uitests_ScreenshotTest_preview_tests[io.element.android.libraries.designsystem.theme.components_null_DefaultGroup_OutlinedTextFieldsLightPreview_0_null,NEXUS_5,1,en].png
View file

@ -1,3 +1,3 @@
version https://git-lfs.github.com/spec/v1
oid sha256:6c0ef4d55a1a21fdcec03d5f95871cb0bea94350cbfc5ed7a50cc343df7898ec
size 21054
oid sha256:4407122130f821256fb19572f50aef531602376d80b4ad0d41ac98558a5552dd
size 37212

4
tests/uitests/src/test/snapshots/images/io.element.android.tests.uitests_ScreenshotTest_preview_tests[io.element.android.libraries.designsystem.theme.components_null_DefaultGroup_TextFieldDarkPreview_0_null,NEXUS_5,1,en].png
View file

@ -1,3 +1,3 @@
version https://git-lfs.github.com/spec/v1
oid sha256:7363a82f68682a66bef4f1742a240afc8da4735aceaecb51ee3472a9db2926a3
size 5954
oid sha256:a4126bd250551e094a1904761c0d49bb4404dda771919ec5fd80d9b088d0e2d4
size 37904

4
tests/uitests/src/test/snapshots/images/io.element.android.tests.uitests_ScreenshotTest_preview_tests[io.element.android.libraries.designsystem.theme.components_null_DefaultGroup_TextFieldLightPreview_0_null,NEXUS_5,1,en].png
View file

@ -1,3 +1,3 @@
version https://git-lfs.github.com/spec/v1
oid sha256:9c31f19f2c19bf94a71bda62792ae710e06e8cec4801c24fe11fbbb2543bcf19
size 5923
oid sha256:c2243658ecef2ec5560f017e8ffe3e3c5549ddaf67116e420c8e70b0603e3013
size 38325