Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Login Textfield design #1010

Merged
merged 2 commits into from
Feb 24, 2021
+159 −74
Merged

Login Textfield design #1010

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
7aaeea4
Using container-style for text fields
AndyScherzinger Feb 15, 2021
f9b0904
Drone: update Lint results to reflect reduced error/warning count [sk…
Feb 23, 2021
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
50 changes: 19 additions & 31 deletions app/src/main/java/com/nextcloud/talk/newarch/features/account/serverentry/ServerEntryView.kt
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -24,7 +24,7 @@ package com.nextcloud.talk.newarch.features.account.serverentry

import android.os.Bundle
import android.view.*
import androidx.core.view.isVisible
import androidx.core.view.isInvisible
import androidx.core.widget.doOnTextChanged
import androidx.lifecycle.Observer
import com.bluelinelabs.conductor.RouterTransaction
Expand Down Expand Up @@ -55,20 +55,21 @@ class ServerEntryView : BaseView() {
viewModel = viewModelProvider(factory).get(ServerEntryViewModel::class.java)
val view = super.onCreateView(inflater, container)

view.serverEntryTextInputEditText.setCompoundDrawablesWithIntrinsicBounds(null, null, resources?.getDrawable(R.drawable.ic_arrow_forward_white_24px), null)
view.serverEntryTextInputEditText.compoundDrawables[2].alpha = 99
view.serverEntryTextInputLayout.endIconDrawable?.alpha = 99
view.host_url_input_helper_text.setText(String.format(resources!!.getString(R.string.nc_server_helper_text), resources?.getString(R.string.nc_server_product_name)))

viewModel.apply {
checkState.observe(this@ServerEntryView, Observer {
when (it.checkState) {
ServerEntryCapabilitiesCheckState.WAITING_FOR_INPUT -> {
view.serverEntryTextInputLayout.isEnabled = true
view.serverEntryProgressBar.isVisible = false
view.serverEntryProgressBar.isInvisible = true
}
ServerEntryCapabilitiesCheckState.CHECKING -> {
view.serverEntryTextInputLayout.isEnabled = false
view.serverEntryTextInputEditText.compoundDrawables[2].alpha = 0
view.serverEntryProgressBar.isVisible = true
view.serverEntryProgressBar.isInvisible = false
view.error_text.isInvisible = true
}
ServerEntryCapabilitiesCheckState.SERVER_SUPPORTED -> {
val bundle = Bundle()
Expand All @@ -79,9 +80,9 @@ class ServerEntryView : BaseView() {
// Unsupported
else -> {
view.serverEntryTextInputLayout.isEnabled = true
view.serverEntryProgressBar.isVisible = false
view.serverEntryTextInputLayout.error = resources?.getString(R.string.nc_server_unsupported)
view.serverEntryTextInputEditText.compoundDrawables[2].alpha = 99
view.serverEntryProgressBar.isInvisible = true
view.error_text.isInvisible = false
view.serverEntryTextInputLayout.endIconDrawable?.alpha = 99
}
}
})
Expand All @@ -91,34 +92,21 @@ class ServerEntryView : BaseView() {
view.serverEntryTextInputLayout.error = null

if (text.isNullOrBlank()) {
view.serverEntryTextInputEditText.compoundDrawables[2].alpha = 99
view.serverEntryTextInputLayout.endIconDrawable?.alpha = 99
} else {
view.serverEntryTextInputEditText.compoundDrawables[2].alpha = 255
view.serverEntryTextInputLayout.endIconDrawable?.alpha = 255
}
}

view.serverEntryTextInputEditText.setOnTouchListener { v, event ->
val drawableLeft = 0
val drawableTop = 1
val drawableRight = 2
val drawableBottom = 3

if (event.action == MotionEvent.ACTION_UP) {
if (event.rawX >= (view.serverEntryTextInputEditText.right - view.serverEntryTextInputEditText.compoundDrawables[drawableRight].bounds.width())) {
if (view.serverEntryTextInputEditText.compoundDrawables[drawableRight].alpha == 255) {
view.serverEntryTextInputEditText?.text?.let { serverUrl ->
var baseUrl = serverUrl.toString()
if (!serverUrl.startsWith("http://") && !serverUrl.startsWith("https://")) {
baseUrl = "https://$serverUrl"
}
viewModel.fetchCapabilities(baseUrl)
true
}
}
view.serverEntryTextInputLayout.setEndIconOnClickListener {
view.serverEntryTextInputEditText?.text?.let { serverUrl ->
var baseUrl = serverUrl.toString()
if (!serverUrl.startsWith("http://") && !serverUrl.startsWith("https://")) {
baseUrl = "https://$serverUrl"
}
viewModel.fetchCapabilities(baseUrl)
true
}

false
}

return view
Expand All @@ -134,4 +122,4 @@ class ServerEntryView : BaseView() {
DisplayUtils.applyColorToStatusBar(activity!!, resources!!.getColor(R.color.colorPrimary))
DisplayUtils.applyColorToNavgiationBar(activity!!.window, resources!!.getColor(R.color.colorPrimary))
}
}
}
142 changes: 101 additions & 41 deletions app/src/main/res/layout/server_entry_view.xml
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,4 +1,5 @@
<?xml version="1.0" encoding="utf-8"?><!--
<?xml version="1.0" encoding="utf-8"?>
<!--
~ /*
~ * Nextcloud Talk application
~ *
Expand All @@ -20,58 +21,117 @@
~ */
-->

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="@+id/scroll"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@color/colorPrimary">
android:layout_gravity="center"
android:background="@color/colorPrimary"
android:fillViewport="true"
android:orientation="vertical">

<ImageView
android:id="@+id/image_logo"
android:layout_width="96dp"
android:layout_height="96dp"
android:layout_above="@+id/serverEntryTextInputLayout"
android:layout_centerHorizontal="true"
android:layout_marginBottom="8dp"
android:scaleType="fitXY"
app:srcCompat="@drawable/ic_logo" />

<com.google.android.material.textfield.TextInputLayout
android:id="@+id/serverEntryTextInputLayout"
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:layout_margin="16dp"
app:errorTextColor="@color/white">
android:gravity="center"
android:orientation="vertical"
android:padding="16dp">

<FrameLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<ImageView
android:id="@+id/image_logo"
android:layout_width="96dp"
android:layout_height="96dp"
android:layout_marginBottom="16dp"
android:contentDescription="@string/app_name"
android:scaleType="fitXY"
app:srcCompat="@drawable/ic_logo" />

<com.google.android.material.textfield.TextInputEditText
<com.google.android.material.textfield.TextInputLayout
android:id="@+id/serverEntryTextInputLayout"
style="@style/Widget.App.Login.TextInputLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="@color/colorPrimary"
android:id="@+id/serverEntryTextInputEditText"
android:hint="@string/nc_server_url"
android:imeOptions="actionDone"
android:inputType="textUri"
android:paddingTop="20dp"
android:paddingBottom="20dp"
android:singleLine="true"
android:textColor="@color/fg_inverse"
android:textCursorDrawable="@null" />
android:theme="@style/TextInputLayoutLogin"
app:endIconContentDescription="@string/nc_server_connect"
app:endIconDrawable="@drawable/ic_arrow_forward_white_24px"
app:endIconMode="custom"
app:endIconTint="@color/white">

<com.google.android.material.textfield.TextInputEditText
android:id="@+id/serverEntryTextInputEditText"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="top"
android:importantForAutofill="no"
android:inputType="textUri|textNoSuggestions"
android:lines="1"
android:minLines="1"
android:paddingStart="16dp"
android:paddingEnd="55dp"
android:scrollbars="vertical"
android:textColor="@color/white"
android:textColorHint="#80FFFFFF">

<requestFocus />

<ProgressBar
android:layout_width="24dp"
</com.google.android.material.textfield.TextInputEditText>

</com.google.android.material.textfield.TextInputLayout>

<TextView
android:id="@+id/host_url_input_helper_text"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:lineSpacingMultiplier="1.2"
android:paddingStart="16dp"
android:paddingTop="4dp"
android:paddingEnd="8dp"
android:paddingBottom="2dp"
android:text="@string/nc_server_helper_text"
android:textColor="#B3FFFFFF" />

<LinearLayout
android:id="@+id/serverEntryProgressBar"
android:visibility="gone"
android:indeterminateTint="@color/white"
android:layout_gravity="end|center_vertical"
android:layout_marginHorizontal="8dp"
/>
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:paddingStart="16dp"
android:paddingTop="2dp"
android:paddingEnd="2dp"
android:paddingBottom="2dp"
android:orientation="horizontal"
android:visibility="invisible">
<ProgressBar
android:layout_width="24dp"
android:layout_height="24dp"
android:layout_gravity="end|center_vertical"
android:indeterminateTint="@color/white"
android:visibility="visible" />
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:paddingStart="5dp"
android:paddingEnd="0dp"
android:text="@string/nc_server_testing_connection"
android:textColor="@color/white" />
</LinearLayout>

<TextView
android:id="@+id/error_text"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:drawablePadding="5dp"
android:gravity="center_vertical"
android:paddingStart="16dp"
android:paddingTop="2dp"
android:paddingEnd="2dp"
android:paddingBottom="2dp"
android:text="@string/nc_server_unsupported"
android:textColor="@color/white"
app:drawableStartCompat="@android:drawable/stat_sys_warning"
android:visibility="invisible" />

</LinearLayout>

</FrameLayout>
</com.google.android.material.textfield.TextInputLayout>
</RelativeLayout>
</ScrollView>
5 changes: 4 additions & 1 deletion app/src/main/res/values/strings.xml
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -23,7 +23,10 @@
<string name="nc_settings">Settings</string>

<!-- Server selection -->
<string name="nc_server_url">Server address</string>
<string name="nc_server_url">Server address https://…</string>
<string name="nc_server_connect">Test server connection</string>
<string name="nc_server_helper_text">The link to your %1$s web interface when you open it in the browser.</string>
<string name="nc_server_testing_connection">Testing connection</string>
<string name="nc_server_not_installed">Please finish your %1$s installation</string>
<string name="nc_server_db_upgrade_needed">Please upgrade your %1$s database</string>
<string name="nc_server_maintenance">Please bring your %1$s out of maintenance</string>
Expand Down
34 changes: 34 additions & 0 deletions app/src/main/res/values/styles.xml
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -81,4 +81,38 @@
<item name="helperTextTextColor">@color/fg_default</item>
<item name="boxStrokeColor">@color/fg_default</item>
</style>

<style name="Widget.App.Login.TextInputLayout" parent="Widget.MaterialComponents.TextInputLayout.OutlinedBox">
<item name="colorControlActivated">@color/white</item>
<item name="colorControlHighlight">@color/white</item>
<item name="materialThemeOverlay">@style/ThemeOverlay.App.Login.TextInputLayout</item>
<item name="shapeAppearance">@style/ShapeAppearance.MaterialComponents.SmallComponent</item>
<item name="hintTextColor">@color/white</item>
<item name="helperTextTextColor">@color/white</item>
</style>

<style name="ThemeOverlay.App.Login.TextInputLayout" parent="">
<item name="colorPrimary">@color/white</item>
<item name="colorOnSurface">@color/white</item>
<item name="colorError">@color/nc_darkRed</item>
<item name="textAppearanceSubtitle1">@style/TextAppearance.MaterialComponents.Subtitle1</item>
<item name="textAppearanceCaption">@style/TextAppearance.MaterialComponents.Caption</item>
<item name="editTextStyle">@style/Widget.MaterialComponents.TextInputEditText.OutlinedBox</item>
</style>

<style name="TextInputLayoutLogin" parent="Widget.MaterialComponents.TextInputLayout.OutlinedBox">
<item name="boxStrokeColor">@color/white</item>
<item name="boxStrokeErrorColor">@color/white</item>
<item name="hintTextAppearance">@style/HintTextLogin</item>
<item name="errorTextAppearance">@style/HintTextLogin</item>
<item name="android:colorPrimary">@color/white</item>
<!-- Theme attributes -->
<item name="android:textColorHint">#80FFFFFF</item>
<item name="colorControlNormal">@color/white</item>
<item name="colorControlActivated">@color/white</item>
</style>

<style name="HintTextLogin" parent="TextAppearance.AppCompat">
<item name="android:textColor">@color/white</item>
</style>
</resources>
2 changes: 1 addition & 1 deletion scripts/analysis/lint-results.txt
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,2 +1,2 @@
DO NOT TOUCH; GENERATED BY DRONE
<span class="mdl-layout-title">Lint Report: 11 errors and 569 warnings</span>
<span class="mdl-layout-title">Lint Report: 11 errors and 566 warnings</span>