Skip to content

Commit

Permalink
Update styling of toolbar, cancel, and download actions (#1848)
Browse files Browse the repository at this point in the history
* Offline area map selector mask and outline

* Update Cancel and Download layout

* Remove unused resource
  • Loading branch information
gino-m authored Sep 8, 2023
1 parent d8e21b9 commit 4bcd7f3
Show file tree
Hide file tree
Showing 7 changed files with 75 additions and 65 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -56,7 +56,6 @@ class OfflineAreaSelectorFragment : Hilt_OfflineAreaSelectorFragment() {
val binding = OfflineBaseMapSelectorFragBinding.inflate(inflater, container, false)
binding.viewModel = viewModel
binding.lifecycleOwner = this
getAbstractActivity().setActionBar(binding.offlineAreaSelectorToolbar, true)
return binding.root
}

Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -96,6 +96,10 @@ internal constructor(
}
}

fun onCancelClick() {
navigator.navigateUp()
}

fun onMapReady(map: Map) {
map.mapType = MapType.TERRAIN
tileSources.forEach { map.addTileOverlay(it) }
Expand Down
29 changes: 0 additions & 29 deletions ground/src/main/res/drawable-anydpi/ic_area_download.xml

This file was deleted.

85 changes: 53 additions & 32 deletions ground/src/main/res/layout/offline_base_map_selector_frag.xml
Original file line number Diff line number Diff line change
Expand Up @@ -34,46 +34,34 @@
android:layout_height="match_parent"
android:fitsSystemWindows="true">

<Toolbar
android:id="@+id/offline_area_selector_toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:minHeight="?attr/actionBarSize"
android:elevation="@dimen/toolbar_elevation"
app:layout_constraintTop_toTopOf="parent">

<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:gravity="center"
android:text="@string/offline_area_selector_title"
android:theme="@style/CenteredToolbarTitle" />
</Toolbar>

<androidx.fragment.app.FragmentContainerView
android:id="@+id/map"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_gravity="center"
app:layout_behavior="com.google.android.ground.ui.home.mapcontainer.MapLayoutBehavior"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintBottom_toBottomOf="@id/button_buttons"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.5"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/offline_area_selector_toolbar" />
<com.google.android.ground.ui.common.TwoLineToolbar
android:id="@+id/offline_area_selector_toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:elevation="@dimen/toolbar_elevation"
android:theme="@style/PrimaryToolbarTheme"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:title="@string/offline_base_map_selector">

<com.google.android.material.button.MaterialButton
android:id="@+id/download_button"
style="@style/ChipButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="bottom|end"
android:layout_marginEnd="@dimen/chip_button_margin_right"
android:layout_marginBottom="@dimen/map_btn_margin_bottom"
android:elevation="6dp"
android:text="@string/offline_base_map_selector_download"
android:onClick="@{() -> viewModel.onDownloadClick()}"
app:backgroundTint="@color/colorMapAccent"
app:chipIcon="@drawable/ic_area_download"
app:icon="@drawable/ic_area_download"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:useCompatPadding="true" />
</com.google.android.ground.ui.common.TwoLineToolbar>
app:layout_constraintTop_toBottomOf="@id/offline_area_selector_toolbar" />

<View
android:id="@+id/top_mask"
Expand All @@ -89,7 +77,7 @@
android:layout_height="80dp"
android:background="@color/blackMapOverlay"
android:alpha="0.4"
app:layout_constraintBottom_toBottomOf="parent" />
app:layout_constraintBottom_toTopOf="@id/button_buttons" />

<View
android:id="@+id/right_mask"
Expand Down Expand Up @@ -121,6 +109,39 @@
app:layout_constraintLeft_toRightOf="@id/left_mask"
app:layout_constraintRight_toLeftOf="@id/right_mask"/>

<LinearLayout
android:id="@+id/button_buttons"
android:layout_width="match_parent"
android:layout_height="90dp"
android:orientation="horizontal"
android:gravity="top"
android:background="@color/md_theme_background"
app:layout_constraintBottom_toBottomOf="parent">

<com.google.android.material.chip.Chip
android:layout_width="wrap_content"
android:layout_height="wrap_content"
style="@style/ChipButton.Secondary"
android:layout_weight="0.5"
android:layout_marginStart="16dp"
android:layout_marginEnd="8dp"
android:layout_marginTop="16dp"
android:text="@string/offline_area_select_cancel_button"
android:onClick="@{() -> viewModel.onCancelClick()}" />

<com.google.android.material.chip.Chip
android:layout_width="wrap_content"
android:layout_height="wrap_content"
style="@style/ChipButton"
android:id="@+id/download_button"
android:text="@string/offline_base_map_selector_download"
android:layout_weight="0.5"
android:layout_marginStart="8dp"
android:layout_marginEnd="16dp"
android:layout_marginTop="16dp"
android:onClick="@{() -> viewModel.onDownloadClick()}" />
</LinearLayout>

</androidx.constraintlayout.widget.ConstraintLayout>
</FrameLayout>
</layout>
4 changes: 2 additions & 2 deletions ground/src/main/res/values/dimens.xml
Original file line number Diff line number Diff line change
Expand Up @@ -50,8 +50,8 @@
<dimen name="submission_summary_text_padding_right">8dp</dimen>
<dimen name="submission_summary_text_max_width">128dp</dimen>
<dimen name="chip_button_padding">14dp</dimen>
<dimen name="chip_button_corner_radius">24dp</dimen>
<dimen name="chip_button_min_height">48dp</dimen>
<dimen name="chip_button_corner_radius">100dp</dimen>
<dimen name="chip_button_min_height">40dp</dimen>
<dimen name="chip_button_text_size">14sp</dimen>
<dimen name="chip_toolbar_button_corner_radius">20dp</dimen>
<dimen name="chip_toolbar_button_padding">10dp</dimen>
Expand Down
2 changes: 2 additions & 0 deletions ground/src/main/res/values/strings.xml
Original file line number Diff line number Diff line change
Expand Up @@ -163,4 +163,6 @@
<string name="contact_survey_organizer_to_obtain_access">Contact your system administrator to request access</string>
<string name="close_app">Close app</string>
<string name="warning_sign_out">Warning: If you sign out, all unsaved data will be lost </string>
<string name="offline_area_select_cancel_button">Cancel</string>
<string name="offline_area_selector_title">Download this area?</string>
</resources>
15 changes: 14 additions & 1 deletion ground/src/main/res/values/styles.xml
Original file line number Diff line number Diff line change
Expand Up @@ -71,6 +71,11 @@
<item name="android:textColor">?attr/colorOnSurface</item>
</style>

<style name="CenteredToolbarTitle">
<item name="android:textColor">?attr/colorOnSurface</item>
<item name="android:textSize">22sp</item>
</style>

<style name="ToolbarSubtitle" parent="TextAppearance.Widget.AppCompat.Toolbar.Subtitle">
<item name="android:textColor">?attr/colorOnSurfaceVariant</item>
<item name="android:textSize">12sp</item>
Expand Down Expand Up @@ -139,12 +144,21 @@
<item name="chipStartPadding">@dimen/chip_button_padding</item>
<item name="chipEndPadding">@dimen/chip_button_padding</item>
<item name="chipMinHeight">@dimen/chip_button_min_height</item>
<item name="android:textAlignment">center</item>

<!-- textColor inside textAppearance stopped working in 28.0.0-rc02. -->
<item name="chipIconTint">?attr/colorSurface</item>
<item name="android:textColor">?attr/colorSurface</item>
<item name="android:textAppearance">@style/ChipButtonText</item>
</style>

<style name="ChipButton.Secondary" parent="ChipButton">
<item name="chipBackgroundColor">?attr/colorSurface</item>
<item name="android:textColor">?attr/colorPrimary</item>
<item name="chipStrokeColor">?attr/colorOutline</item>
<item name="chipStrokeWidth">1dp</item>
</style>

<style name="ChipButton.Toolbar">
<item name="chipCornerRadius">@dimen/chip_toolbar_button_corner_radius</item>
<item name="chipStartPadding">@dimen/chip_toolbar_button_padding</item>
Expand All @@ -154,7 +168,6 @@

<style name="ChipButtonText">
<item name="android:textSize">@dimen/chip_button_text_size</item>
<item name="android:textStyle">bold</item>
</style>

<!-- NavDrawer Header -->
Expand Down

0 comments on commit 4bcd7f3

Please sign in to comment.