2
0
mirror of https://github.com/fork-maintainers/iceraven-browser synced 2024-11-03 23:15:31 +00:00

[fenix] For https://github.com/mozilla-mobile/fenix/issues/15756 - Add a play/pause button in the tabs tray grid layout

Moved the previous layout in a new, bigger FrameLayout that would serve as a
buffer space for the play/pause button to be translated to the exterior.
Otherwise the button would be clipped.
This commit is contained in:
Mugurell 2020-10-16 19:44:59 +03:00 committed by Gabriel Luong
parent 949d66da5f
commit f90db55a2f

View File

@ -2,114 +2,135 @@
<!-- This Source Code Form is subject to the terms of the Mozilla Public
- License, v. 2.0. If a copy of the MPL was not distributed with this
- file, You can obtain one at http://mozilla.org/MPL/2.0/. -->
<com.google.android.material.card.MaterialCardView xmlns:android="http://schemas.android.com/apk/res/android"
<!--
A FrameLayout here is an efficient way of having a views stack while allowing:
- a sufficient enough canvas for the play button to be outside translated
without it getting clipped by the GridLayoutManager.
- enough padding for the primary view that needs to be displayed with a border around it.
-->
<FrameLayout
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"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginStart="8dp"
android:layout_marginTop="16dp"
android:layout_marginEnd="8dp"
app:cardBackgroundColor="@color/photonWhite"
app:cardCornerRadius="@dimen/tab_tray_grid_item_border_radius"
app:cardElevation="0dp"
app:strokeColor="@color/photonLightGrey30"
app:strokeWidth="1dp">
android:layout_height="202dp"
android:clipChildren="false"
android:clipToPadding="false"
android:importantForAccessibility="no"
android:padding="8dp">
<androidx.constraintlayout.widget.ConstraintLayout
android:id="@+id/tab_item"
<com.google.android.material.card.MaterialCardView
android:layout_width="match_parent"
android:layout_height="match_parent">
android:layout_height="wrap_content"
android:layout_gravity="center"
android:importantForAccessibility="yes"
app:cardBackgroundColor="@color/photonWhite"
app:cardCornerRadius="@dimen/tab_tray_grid_item_border_radius"
app:cardElevation="0dp"
app:strokeColor="@color/photonLightGrey30"
app:strokeWidth="1dp">
<ImageButton
android:id="@+id/play_pause_button"
android:layout_width="24dp"
android:layout_height="24dp"
android:layout_marginTop="23dp"
android:background="?attr/selectableItemBackgroundBorderless"
android:contentDescription="@string/mozac_feature_media_notification_action_pause"
android:elevation="10dp"
android:visibility="gone"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:srcCompat="@drawable/media_state_play" />
<ImageView
android:id="@+id/mozac_browser_tabstray_favicon_icon"
android:layout_width="16dp"
android:layout_height="16dp"
android:layout_marginStart="8dp"
android:importantForAccessibility="no"
app:layout_constraintBottom_toTopOf="@id/horizonatal_divider"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<TextView
android:id="@+id/mozac_browser_tabstray_title"
android:layout_width="0dp"
android:layout_height="30dp"
android:layout_alignParentTop="true"
android:ellipsize="none"
android:fadingEdgeLength="25dp"
android:paddingHorizontal="7dp"
android:paddingVertical="5dp"
android:requiresFadingEdge="horizontal"
android:singleLine="true"
android:textColor="@color/photonInk80"
android:textSize="14sp"
android:visibility="visible"
app:layout_constraintEnd_toStartOf="@id/mozac_browser_tabstray_close"
app:layout_constraintStart_toEndOf="@id/mozac_browser_tabstray_favicon_icon"
app:layout_constraintTop_toTopOf="parent"
tools:text="Example Domain" />
<androidx.appcompat.widget.AppCompatImageButton
android:id="@+id/mozac_browser_tabstray_close"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="?android:attr/selectableItemBackgroundBorderless"
android:contentDescription="@string/close_tab"
app:layout_constraintBottom_toTopOf="@+id/horizonatal_divider"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:srcCompat="@drawable/mozac_ic_close"
app:tint="@color/photonInk80" />
<View
android:id="@+id/horizonatal_divider"
<androidx.constraintlayout.widget.ConstraintLayout
android:id="@+id/tab_item"
android:layout_width="match_parent"
android:layout_height="1dp"
android:background="@color/photonLightGrey30"
app:layout_constraintTop_toBottomOf="@+id/mozac_browser_tabstray_title" />
<androidx.cardview.widget.CardView
android:id="@+id/mozac_browser_tabstray_card"
android:layout_width="match_parent"
android:layout_height="@dimen/tab_tray_grid_item_thumbnail_height"
android:backgroundTint="?tabTrayThumbnailItemBackground"
app:cardBackgroundColor="@color/photonWhite"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/horizonatal_divider">
android:layout_height="match_parent"
android:clipChildren="false"
android:clipToPadding="false">
<ImageView
android:id="@+id/default_tab_thumbnail"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="@+id/mozac_browser_tabstray_favicon_icon"
android:layout_width="16dp"
android:layout_height="16dp"
android:layout_marginStart="8dp"
android:importantForAccessibility="no"
android:padding="22dp"
app:srcCompat="@drawable/mozac_ic_globe"
app:tint="?tabTrayThumbnailIcon" />
app:layout_constraintBottom_toTopOf="@id/horizonatal_divider"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<mozilla.components.browser.tabstray.thumbnail.TabThumbnailView
android:id="@+id/mozac_browser_tabstray_thumbnail"
<TextView
android:id="@+id/mozac_browser_tabstray_title"
android:layout_width="0dp"
android:layout_height="30dp"
android:layout_alignParentTop="true"
android:ellipsize="none"
android:fadingEdgeLength="25dp"
android:paddingHorizontal="7dp"
android:paddingVertical="5dp"
android:requiresFadingEdge="horizontal"
android:singleLine="true"
android:textColor="@color/photonInk80"
android:textSize="14sp"
android:visibility="visible"
app:layout_constraintEnd_toStartOf="@id/mozac_browser_tabstray_close"
app:layout_constraintStart_toEndOf="@id/mozac_browser_tabstray_favicon_icon"
app:layout_constraintTop_toTopOf="parent"
tools:text="Example Domain" />
<androidx.appcompat.widget.AppCompatImageButton
android:id="@+id/mozac_browser_tabstray_close"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="?android:attr/selectableItemBackgroundBorderless"
android:contentDescription="@string/close_tab"
app:layout_constraintBottom_toTopOf="@+id/horizonatal_divider"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:srcCompat="@drawable/mozac_ic_close"
app:tint="@color/photonInk80" />
<View
android:id="@+id/horizonatal_divider"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:contentDescription="@string/mozac_browser_tabstray_open_tab" />
android:layout_height="1dp"
android:background="@color/photonLightGrey30"
app:layout_constraintTop_toBottomOf="@+id/mozac_browser_tabstray_title" />
<include layout="@layout/checkbox_item" />
<androidx.cardview.widget.CardView
android:id="@+id/mozac_browser_tabstray_card"
android:layout_width="match_parent"
android:layout_height="@dimen/tab_tray_grid_item_thumbnail_height"
android:backgroundTint="?tabTrayThumbnailItemBackground"
app:cardBackgroundColor="@color/photonWhite"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/horizonatal_divider">
</androidx.cardview.widget.CardView>
<ImageView
android:id="@+id/default_tab_thumbnail"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:importantForAccessibility="no"
android:padding="22dp"
app:srcCompat="@drawable/mozac_ic_globe"
app:tint="?tabTrayThumbnailIcon" />
</androidx.constraintlayout.widget.ConstraintLayout>
<mozilla.components.browser.tabstray.thumbnail.TabThumbnailView
android:id="@+id/mozac_browser_tabstray_thumbnail"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:contentDescription="@string/mozac_browser_tabstray_open_tab" />
</com.google.android.material.card.MaterialCardView>
<include layout="@layout/checkbox_item" />
</androidx.cardview.widget.CardView>
</androidx.constraintlayout.widget.ConstraintLayout>
</com.google.android.material.card.MaterialCardView>
<ImageButton
android:id="@+id/play_pause_button"
android:layout_width="24dp"
android:layout_height="24dp"
android:layout_gravity="top|start"
android:background="?attr/selectableItemBackgroundBorderless"
android:contentDescription="@string/mozac_feature_media_notification_action_pause"
android:elevation="10dp"
android:importantForAccessibility="yes"
android:translationX="-8dp"
android:translationY="-8dp"
android:visibility="gone"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:srcCompat="@drawable/media_state_play" />
</FrameLayout>