Skip to content

Commit

Permalink
Update manual onboarding screens to prevent the button from overlappi…
Browse files Browse the repository at this point in the history
…ng elements (#3909)

* Update manual onboarding screen to prevent the button from overlapping elements

* Limit to 2 lines of text

* Switch to ScrollView

* Add padding for round devices

* Review comments
  • Loading branch information
dshokouhi committed Oct 5, 2023
1 parent a14441f commit d7a08d3
Show file tree
Hide file tree
Showing 5 changed files with 171 additions and 111 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -10,6 +10,7 @@ import androidx.wear.activity.ConfirmationActivity
import dagger.hilt.android.AndroidEntryPoint
import io.homeassistant.companion.android.databinding.ActivityIntegrationBinding
import io.homeassistant.companion.android.home.HomeActivity
import io.homeassistant.companion.android.util.adjustInset
import javax.inject.Inject
import io.homeassistant.companion.android.common.R as commonR

Expand Down Expand Up @@ -39,17 +40,20 @@ class MobileAppIntegrationActivity : AppCompatActivity(), MobileAppIntegrationVi
binding = ActivityIntegrationBinding.inflate(layoutInflater)
setContentView(binding.root)

binding.serverUrl.setText(Build.MODEL)
binding.deviceName.setText(Build.MODEL)

binding.finish.setOnClickListener {
presenter.onRegistrationAttempt(serverId, binding.serverUrl.text.toString())
presenter.onRegistrationAttempt(serverId, binding.deviceName.text.toString())
}

adjustInset(applicationContext, binding, null)
}

override fun onResume() {
super.onResume()

binding.loadingView.visibility = View.GONE
binding.constraintLayout.visibility = View.VISIBLE
}

override fun deviceRegistered() {
Expand All @@ -61,6 +65,7 @@ class MobileAppIntegrationActivity : AppCompatActivity(), MobileAppIntegrationVi

override fun showLoading() {
binding.loadingView.visibility = View.VISIBLE
binding.constraintLayout.visibility = View.GONE
}

override fun showError() {
Expand All @@ -74,6 +79,7 @@ class MobileAppIntegrationActivity : AppCompatActivity(), MobileAppIntegrationVi
}
startActivity(intent)
binding.loadingView.visibility = View.GONE
binding.constraintLayout.visibility = View.VISIBLE
}

override fun onDestroy() {
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -12,6 +12,7 @@ import dagger.hilt.android.AndroidEntryPoint
import io.homeassistant.companion.android.R
import io.homeassistant.companion.android.databinding.ActivityManualSetupBinding
import io.homeassistant.companion.android.onboarding.integration.MobileAppIntegrationActivity
import io.homeassistant.companion.android.util.adjustInset
import javax.inject.Inject
import io.homeassistant.companion.android.common.R as commonR

Expand All @@ -36,8 +37,10 @@ class ManualSetupActivity : AppCompatActivity(), ManualSetupView {
setContentView(binding.root)

binding.buttonNext.setOnClickListener {
presenter.onNextClicked(this, findViewById<EditText>(R.id.server_url).text.toString())
presenter.onNextClicked(this, findViewById<EditText>(R.id.device_name).text.toString())
}

adjustInset(applicationContext, null, binding)
}

override fun startIntegration(serverId: Int) {
Expand All @@ -46,6 +49,7 @@ class ManualSetupActivity : AppCompatActivity(), ManualSetupView {

override fun showLoading() {
binding.loadingView.visibility = View.VISIBLE
binding.constraintLayout.visibility = View.GONE
}

override fun showContinueOnPhone() {
Expand All @@ -59,6 +63,7 @@ class ManualSetupActivity : AppCompatActivity(), ManualSetupView {
}
startActivity(confirmation)
binding.loadingView.visibility = View.GONE
binding.constraintLayout.visibility = View.VISIBLE
}

override fun showError(@StringRes message: Int) {
Expand All @@ -72,12 +77,14 @@ class ManualSetupActivity : AppCompatActivity(), ManualSetupView {
}
startActivity(intent)
binding.loadingView.visibility = View.GONE
binding.constraintLayout.visibility = View.VISIBLE
}

override fun onResume() {
super.onResume()

binding.loadingView.visibility = View.GONE
binding.constraintLayout.visibility = View.VISIBLE
}

override fun onDestroy() {
Expand Down
Original file line number Diff line number Diff line change
@@ -0,0 +1,23 @@
package io.homeassistant.companion.android.util

import android.content.Context
import android.content.res.Resources
import io.homeassistant.companion.android.databinding.ActivityIntegrationBinding
import io.homeassistant.companion.android.databinding.ActivityManualSetupBinding

private const val FACTOR = 0.146467f // c = a * sqrt(2)

fun adjustInset(
context: Context,
integrationBinding: ActivityIntegrationBinding? = null,
manualSetupBinding: ActivityManualSetupBinding? = null
) {
if (context.resources.configuration.isScreenRound) {
val inset = (FACTOR * Resources.getSystem().displayMetrics.widthPixels).toInt()
if (integrationBinding != null) {
integrationBinding.linearLayout.setPadding(inset, inset, inset, inset)
} else {
manualSetupBinding?.linearLayout?.setPadding(inset, inset, inset, inset)
}
}
}
121 changes: 66 additions & 55 deletions wear/src/main/res/layout/activity_integration.xml
Original file line number Diff line number Diff line change
@@ -1,60 +1,71 @@
<?xml version="1.0" encoding="utf-8"?>
<androidx.wear.widget.BoxInsetLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"

<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:padding="@dimen/box_inset_layout_padding"
tools:context=".onboarding.integration.MobileAppIntegrationActivity"
tools:deviceIds="wear">
android:layout_height="match_parent">
<requestFocus />

<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:padding="@dimen/inner_frame_layout_padding"
app:layout_boxedEdges="all">

<EditText
android:id="@+id/server_url"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="8dp"
android:ems="10"
android:hint="@string/device_name"
android:inputType="textPersonName"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/textView"
android:importantForAutofill="no" />

<TextView
android:id="@+id/textView"
style="@style/HeaderText"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="@string/registerDevice"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />

<com.google.android.material.floatingactionbutton.FloatingActionButton
android:id="@+id/finish"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="8dp"
android:contentDescription="@string/button_forward"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:srcCompat="@drawable/ic_button_check" />

</androidx.constraintlayout.widget.ConstraintLayout>

<io.homeassistant.companion.android.util.LoadingView
android:id="@+id/loading_view"
<LinearLayout xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:id="@+id/linear_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:loading_text="@string/attempting_registration"
android:visibility="gone" />
android:layout_height="wrap_content"
android:gravity="center"
tools:context=".onboarding.integration.MobileAppIntegrationActivity"
tools:deviceIds="wear"
android:orientation="vertical">

<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="@+id/constraint_layout"
android:padding="@dimen/inner_frame_layout_padding"
app:layout_boxedEdges="all">

<EditText
android:id="@+id/device_name"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="8dp"
android:ems="10"
android:minHeight="48dp"
android:hint="@string/device_name"
android:inputType="textPersonName"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/textView"
android:importantForAutofill="no" />

<TextView
android:id="@+id/textView"
style="@style/HeaderText"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="@string/registerDevice"
android:textAlignment="center"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />

<com.google.android.material.floatingactionbutton.FloatingActionButton
android:id="@+id/finish"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="4dp"
android:contentDescription="@string/button_forward"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/device_name"
app:srcCompat="@drawable/ic_button_check" />

</androidx.constraintlayout.widget.ConstraintLayout>

<io.homeassistant.companion.android.util.LoadingView
android:id="@+id/loading_view"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:loading_text="@string/attempting_registration"
android:visibility="gone" />

</androidx.wear.widget.BoxInsetLayout>
</LinearLayout>
</ScrollView>
119 changes: 66 additions & 53 deletions wear/src/main/res/layout/activity_manual_setup.xml
Original file line number Diff line number Diff line change
@@ -1,58 +1,71 @@
<?xml version="1.0" encoding="utf-8"?>
<androidx.wear.widget.BoxInsetLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"

<ScrollView xmlns:tools="http://schemas.android.com/tools"
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:padding="@dimen/box_inset_layout_padding"
tools:deviceIds="wear">
android:layout_height="match_parent">
<requestFocus />

<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:padding="@dimen/inner_frame_layout_padding"
app:layout_boxedEdges="all">

<EditText
android:id="@+id/server_url"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="8dp"
android:ems="10"
android:hint="@string/input_url_hint"
android:inputType="textNoSuggestions"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/textView"
android:importantForAutofill="no" />

<TextView
android:id="@+id/textView"
style="@style/HeaderText"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="@string/choose_server"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />

<com.google.android.material.floatingactionbutton.FloatingActionButton
android:id="@+id/button_next"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:contentDescription="@string/button_forward"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:srcCompat="@drawable/ic_button_arrow_forward" />

</androidx.constraintlayout.widget.ConstraintLayout>

<io.homeassistant.companion.android.util.LoadingView
android:id="@+id/loading_view"
<LinearLayout xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:loading_text="@string/attempting_connection"
android:visibility="gone" />
android:layout_height="wrap_content"
android:id="@+id/linear_layout"
android:gravity="center"
tools:deviceIds="wear"
android:orientation="vertical">

<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="@+id/constraint_layout"
android:padding="@dimen/inner_frame_layout_padding"
app:layout_boxedEdges="all">

<EditText
android:id="@+id/device_name"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="8dp"
android:ems="10"
android:minHeight="48dp"
android:hint="@string/input_url_hint"
android:inputType="textNoSuggestions"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/textView"
android:importantForAutofill="no"
tools:ignore="TextFields" />

<TextView
android:id="@+id/textView"
style="@style/HeaderText"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="@string/manual_title"
android:textAlignment="center"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />

<com.google.android.material.floatingactionbutton.FloatingActionButton
android:id="@+id/button_next"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="4dp"
android:contentDescription="@string/button_forward"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/device_name"
app:srcCompat="@drawable/ic_button_arrow_forward" />

</androidx.constraintlayout.widget.ConstraintLayout>

<io.homeassistant.companion.android.util.LoadingView
android:id="@+id/loading_view"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:loading_text="@string/attempting_connection"
android:visibility="gone" />

</androidx.wear.widget.BoxInsetLayout>
</LinearLayout>
</ScrollView>

0 comments on commit d7a08d3

Please sign in to comment.