Donate to e Foundation | Murena handsets with /e/OS | Own a part of Murena! Learn more

Commit 3f2e85a9 authored by cecilia's avatar cecilia
Browse files

Update Smartspace media recommendation card appearance to match the latest mock. 

A contextual card header is added, and also the expanded version of recommendation card.

Screenshots:
[Compact]
- http://screen/U3SPZQHPYLyoU4t
- http://screen/8ccMqUqUmBQUvmd
[Expanded]
- http://screen/9ASnXWGHWoyph2B
- http://screen/A6hzbLDjpfsjVkA

Demo: https://drive.google.com/file/d/1iRZBhC81q-HflRQDUgzMbNeBagkAo9aS/view?usp=sharing

Fixes: 186165627
Test: Studio builds
Change-Id: Ib7f65bdcbe7ede1901c7969d04f3efbbc7c2461d
parent de939e65

packages/SystemUI/res/layout/media_smartspace_recommendations.xml

+85 −17
Original line number Diff line number Diff line
@@ -19,29 +19,57 @@ 
<com.android.systemui.util.animation.TransitionLayout

    xmlns:android="http://schemas.android.com/apk/res/android"

    xmlns:app="http://schemas.android.com/apk/res-auto"

    xmlns:androidprv="http://schemas.android.com/apk/prv/res/android"

    android:id="@+id/media_recommendations"

    android:layout_width="match_parent"

    android:layout_height="wrap_content"

    android:paddingTop="8dp"

    android:paddingBottom="8dp"

    android:paddingStart="@dimen/qs_media_padding"

    android:paddingEnd="@dimen/qs_media_padding"

    android:clipChildren="false"

    android:clipToPadding="false"

    android:forceHasOverlappingRendering="false"

    android:background="@drawable/qs_media_background">



    <androidx.constraintlayout.widget.Guideline

        android:id="@+id/media_vertical_start_guideline"

        android:layout_width="wrap_content"

        android:layout_height="wrap_content"

        android:orientation="vertical"

        app:layout_constraintGuide_percent="0.25" />



    <ImageView

        android:id="@+id/recommendation_card_icon"

        android:layout_width="@dimen/qs_aa_media_rec_header_icon_size"

        android:layout_height="@dimen/qs_aa_media_rec_header_icon_size"

        android:src="@drawable/ic_headset"

        android:tint="?android:attr/colorPrimary" />



    <TextView

        android:id="@+id/recommendation_card_text"

        android:layout_width="wrap_content"

        android:layout_height="wrap_content"

        android:singleLine="true"

        android:text="@string/controls_media_smartspace_rec_title"

        android:fontFamily="google-sans-medium"

        android:textColor="?android:attr/colorPrimary"

        android:textDirection="locale"

        android:textSize="@dimen/qq_aa_media_rec_header_text_size" />



    <ImageView

        android:id="@+id/media_cover1"

        android:layout_width="@dimen/qs_aa_media_rec_album_size"

        android:layout_height="@dimen/qs_aa_media_rec_album_size"

        android:adjustViewBounds="true"

        android:background="@drawable/bg_smartspace_media_item"

        android:backgroundTint="?androidprv:attr/colorAccentSecondary"

        android:clipToOutline="true"

        android:scaleType="centerCrop"/>



    <ImageView

    <com.android.internal.widget.CachingIconView

        android:id="@+id/media_logo1"

        android:layout_width="@dimen/qs_aa_media_rec_icon_size"

        android:layout_height="@dimen/qs_aa_media_rec_icon_size" />

        android:layout_width="@dimen/qs_media_icon_size"

        android:layout_height="@dimen/qs_media_icon_size"

        android:background="@drawable/qs_media_icon_background" />



    <ImageView

        android:id="@+id/media_cover2"
@@ -49,13 +77,15 @@ 
        android:layout_height="@dimen/qs_aa_media_rec_album_size"

        android:adjustViewBounds="true"

        android:background="@drawable/bg_smartspace_media_item"

        android:backgroundTint="?androidprv:attr/colorAccentSecondary"

        android:clipToOutline="true"

        android:scaleType="centerCrop"/>



    <ImageView

    <com.android.internal.widget.CachingIconView

        android:id="@+id/media_logo2"

        android:layout_width="@dimen/qs_aa_media_rec_icon_size"

        android:layout_height="@dimen/qs_aa_media_rec_icon_size" />

        android:layout_width="@dimen/qs_media_icon_size"

        android:layout_height="@dimen/qs_media_icon_size"

        android:background="@drawable/qs_media_icon_background" />



    <ImageView

        android:id="@+id/media_cover3"
@@ -63,13 +93,15 @@ 
        android:layout_height="@dimen/qs_aa_media_rec_album_size"

        android:adjustViewBounds="true"

        android:background="@drawable/bg_smartspace_media_item"

        android:backgroundTint="?androidprv:attr/colorAccentSecondary"

        android:clipToOutline="true"

        android:scaleType="centerCrop"/>



    <ImageView

    <com.android.internal.widget.CachingIconView

        android:id="@+id/media_logo3"

        android:layout_width="@dimen/qs_aa_media_rec_icon_size"

        android:layout_height="@dimen/qs_aa_media_rec_icon_size" />

        android:layout_width="@dimen/qs_media_icon_size"

        android:layout_height="@dimen/qs_media_icon_size"

        android:background="@drawable/qs_media_icon_background" />



    <ImageView

        android:id="@+id/media_cover4"
@@ -77,15 +109,49 @@ 
        android:layout_height="@dimen/qs_aa_media_rec_album_size"

        android:adjustViewBounds="true"

        android:background="@drawable/bg_smartspace_media_item"

        android:backgroundTint="?androidprv:attr/colorAccentSecondary"

        android:clipToOutline="true"

        android:scaleType="centerCrop"/>



    <ImageView

    <com.android.internal.widget.CachingIconView

        android:id="@+id/media_logo4"

        android:layout_width="@dimen/qs_aa_media_rec_icon_size"

        android:layout_height="@dimen/qs_aa_media_rec_icon_size" />

        android:layout_width="@dimen/qs_media_icon_size"

        android:layout_height="@dimen/qs_media_icon_size"

        android:background="@drawable/qs_media_icon_background" />



    <!-- Constraints are set here as they are the same regardless of host -->

    <ImageView

        android:id="@+id/media_cover5"

        android:layout_width="@dimen/qs_aa_media_rec_album_size"

        android:layout_height="@dimen/qs_aa_media_rec_album_size"

        android:adjustViewBounds="true"

        android:background="@drawable/bg_smartspace_media_item"

        android:backgroundTint="?androidprv:attr/colorAccentSecondary"

        android:clipToOutline="true"

        android:scaleType="centerCrop"/>



    <com.android.internal.widget.CachingIconView

        android:id="@+id/media_logo5"

        android:layout_width="@dimen/qs_media_icon_size"

        android:layout_height="@dimen/qs_media_icon_size"

        android:background="@drawable/qs_media_icon_background" />



    <ImageView

        android:id="@+id/media_cover6"

        android:layout_width="@dimen/qs_aa_media_rec_album_size"

        android:layout_height="@dimen/qs_aa_media_rec_album_size"

        android:adjustViewBounds="true"

        android:background="@drawable/bg_smartspace_media_item"

        android:backgroundTint="?androidprv:attr/colorAccentSecondary"

        android:clipToOutline="true"

        android:scaleType="centerCrop"/>



    <com.android.internal.widget.CachingIconView

        android:id="@+id/media_logo6"

        android:layout_width="@dimen/qs_media_icon_size"

        android:layout_height="@dimen/qs_media_icon_size"

        android:background="@drawable/qs_media_icon_background" />



    <!-- Long press menu -->

    <TextView

        android:layout_width="wrap_content"

        android:layout_height="wrap_content"
@@ -136,7 +202,8 @@ 
        android:minWidth="48dp"

        android:minHeight="48dp"

        app:layout_constraintBottom_toBottomOf="parent"

        app:layout_constraintEnd_toStartOf="@id/dismiss" >

        app:layout_constraintEnd_toStartOf="@id/dismiss"

        app:layout_constraintTop_toBottomOf="@id/remove_text">



        <TextView

            android:layout_gravity="bottom"
@@ -158,7 +225,8 @@ 
        android:minWidth="48dp"

        android:minHeight="48dp"

        app:layout_constraintBottom_toBottomOf="parent"

        app:layout_constraintEnd_toEndOf="parent">

        app:layout_constraintEnd_toEndOf="parent"

        app:layout_constraintTop_toBottomOf="@id/remove_text">



        <TextView

            android:layout_gravity="bottom"

packages/SystemUI/res/values/dimens.xml

+4 −2
Original line number Diff line number Diff line
@@ -1276,8 +1276,10 @@ 
    <dimen name="qs_media_disabled_seekbar_vertical_padding">36dp</dimen>



    <!-- Size of Smartspace media recommendations cards in the QSPanel carousel -->

    <dimen name="qs_aa_media_rec_album_size">80dp</dimen>

    <dimen name="qs_aa_media_rec_icon_size">20dp</dimen>

    <dimen name="qs_aa_media_rec_header_icon_padding">10dp</dimen>

    <dimen name="qs_aa_media_rec_header_icon_size">18dp</dimen>

    <dimen name="qs_aa_media_rec_album_size">72dp</dimen>

    <dimen name="qq_aa_media_rec_header_text_size">16sp</dimen>



    <!-- Window magnification -->

    <dimen name="magnification_border_drag_size">35dp</dimen>

packages/SystemUI/res/values/strings.xml

+3 −0
Original line number Diff line number Diff line
@@ -2837,6 +2837,9 @@ 
    <!-- Label for button to go to media control settings screen [CHAR_LIMIT=30] -->

    <string name="controls_media_settings_button">Settings</string>



    <!-- Title for Smartspace recommendation card within media controls [CHAR_LIMIT=50] -->

    <string name="controls_media_smartspace_rec_title">Play</string>



    <!-- Error message indicating that a control timed out while waiting for an update [CHAR_LIMIT=30] -->

    <string name="controls_error_timeout">Inactive, check app</string>

    <!-- Error message indicating that an unspecified error occurred while getting the status, and

packages/SystemUI/res/xml/media_recommendation.xml→packages/SystemUI/res/xml/media_recommendation_collapsed.xml

+172 −0
Original line number Diff line number Diff line
@@ -18,21 +18,44 @@ 
    xmlns:android="http://schemas.android.com/apk/res/android"

    xmlns:app="http://schemas.android.com/apk/res-auto">



    <Constraint

        android:id="@+id/recommendation_card_icon"

        android:layout_width="@dimen/qs_aa_media_rec_header_icon_size"

        android:layout_height="@dimen/qs_aa_media_rec_header_icon_size"

        android:layout_marginTop="@dimen/qs_aa_media_rec_header_icon_padding"

        android:layout_marginStart="@dimen/qs_aa_media_rec_header_icon_padding"

        app:layout_constraintTop_toTopOf="parent"

        app:layout_constraintStart_toStartOf="parent"

        app:layout_constraintEnd_toStartOf="@id/media_vertical_start_guideline"

        app:layout_constraintHorizontal_bias="0" />



    <Constraint

        android:id="@+id/recommendation_card_text"

        android:layout_width="wrap_content"

        android:layout_height="wrap_content"

        android:layout_marginStart="@dimen/qs_aa_media_rec_header_icon_padding"

        app:layout_constraintTop_toBottomOf="@id/recommendation_card_icon"

        app:layout_constraintStart_toStartOf="parent"

        app:layout_constraintEnd_toStartOf="@id/media_vertical_start_guideline"

        app:layout_constraintHorizontal_bias="0" />



    <Constraint

        android:id="@+id/media_cover1"

        android:layout_width="@dimen/qs_aa_media_rec_album_size"

        android:layout_height="@dimen/qs_aa_media_rec_album_size"

        app:layout_constraintTop_toTopOf="parent"

        app:layout_constraintBottom_toBottomOf="parent"

        app:layout_constraintStart_toStartOf="parent"

        app:layout_constraintStart_toEndOf="@id/media_vertical_start_guideline"

        app:layout_constraintEnd_toStartOf="@id/media_cover2"

        app:layout_constraintHorizontal_weight="1"

        app:layout_constraintHorizontal_chainStyle="spread"

        android:visibility="gone" />



    <Constraint

        android:id="@+id/media_logo1"

        android:layout_width="@dimen/qs_aa_media_rec_icon_size"

        android:layout_height="@dimen/qs_aa_media_rec_icon_size"

        android:layout_width="@dimen/qs_media_icon_size"

        android:layout_height="@dimen/qs_media_icon_size"

        android:translationY="@dimen/qs_media_icon_offset"

        android:translationX="@dimen/qs_media_icon_offset"

        app:layout_constraintEnd_toEndOf="@+id/media_cover1"

        app:layout_constraintBottom_toBottomOf="@+id/media_cover1"

        android:visibility="gone" />
@@ -45,13 +68,15 @@ 
        app:layout_constraintBottom_toBottomOf="parent"

        app:layout_constraintStart_toEndOf="@id/media_cover1"

        app:layout_constraintEnd_toStartOf="@id/media_cover3"

        app:layout_constraintHorizontal_weight="1"

        app:layout_constraintHorizontal_chainStyle="spread"

        android:visibility="gone" />



    <Constraint

        android:id="@+id/media_logo2"

        android:layout_width="@dimen/qs_aa_media_rec_icon_size"

        android:layout_height="@dimen/qs_aa_media_rec_icon_size"

        android:layout_width="@dimen/qs_media_icon_size"

        android:layout_height="@dimen/qs_media_icon_size"

        android:translationY="@dimen/qs_media_icon_offset"

        android:translationX="@dimen/qs_media_icon_offset"

        app:layout_constraintEnd_toEndOf="@+id/media_cover2"

        app:layout_constraintBottom_toBottomOf="@+id/media_cover2"

        android:visibility="gone" />
@@ -63,14 +88,17 @@ 
        app:layout_constraintTop_toTopOf="parent"

        app:layout_constraintBottom_toBottomOf="parent"

        app:layout_constraintStart_toEndOf="@id/media_cover2"

        app:layout_constraintEnd_toStartOf="@id/media_cover4"

        app:layout_constraintHorizontal_weight="1"

        app:layout_constraintEnd_toEndOf="parent"

        app:layout_constraintHorizontal_chainStyle="spread"

        app:layout_constraintHorizontal_bias="1"

        android:visibility="gone" />



    <Constraint

        android:id="@+id/media_logo3"

        android:layout_width="@dimen/qs_aa_media_rec_icon_size"

        android:layout_height="@dimen/qs_aa_media_rec_icon_size"

        android:layout_width="@dimen/qs_media_icon_size"

        android:layout_height="@dimen/qs_media_icon_size"

        android:translationY="@dimen/qs_media_icon_offset"

        android:translationX="@dimen/qs_media_icon_offset"

        app:layout_constraintEnd_toEndOf="@+id/media_cover3"

        app:layout_constraintBottom_toBottomOf="@+id/media_cover3"

        android:visibility="gone" />
@@ -78,20 +106,67 @@ 
    <Constraint

        android:id="@+id/media_cover4"

        android:layout_width="@dimen/qs_aa_media_rec_album_size"

        android:layout_height="@dimen/qs_aa_media_rec_album_size"

        app:layout_constraintTop_toTopOf="parent"

        android:layout_height="0dp"

        app:layout_constraintTop_toBottomOf="@+id/media_cover1"

        app:layout_constraintBottom_toBottomOf="parent"

        app:layout_constraintStart_toEndOf="@id/media_cover3"

        app:layout_constraintEnd_toEndOf="parent"

        app:layout_constraintHorizontal_weight="1"

        app:layout_constraintStart_toEndOf="@id/media_vertical_start_guideline"

        app:layout_constraintEnd_toStartOf="@id/media_cover5"

        app:layout_constraintHorizontal_chainStyle="spread"

        app:layout_constraintHorizontal_bias="1"

        android:visibility="gone" />



    <Constraint

        android:id="@+id/media_logo4"

        android:layout_width="@dimen/qs_aa_media_rec_icon_size"

        android:layout_height="@dimen/qs_aa_media_rec_icon_size"

        android:layout_width="@dimen/qs_media_icon_size"

        android:layout_height="0dp"

        android:translationY="@dimen/qs_media_icon_offset"

        android:translationX="@dimen/qs_media_icon_offset"

        app:layout_constraintEnd_toEndOf="@+id/media_cover4"

        app:layout_constraintBottom_toBottomOf="@+id/media_cover4"

        android:visibility="gone" />



    <Constraint

        android:id="@+id/media_cover5"

        android:layout_width="@dimen/qs_aa_media_rec_album_size"

        android:layout_height="0dp"

        app:layout_constraintTop_toBottomOf="@+id/media_cover2"

        app:layout_constraintBottom_toBottomOf="parent"

        app:layout_constraintStart_toEndOf="@+id/media_cover4"

        app:layout_constraintEnd_toStartOf="@+id/media_cover6"

        app:layout_constraintHorizontal_chainStyle="spread"

        app:layout_constraintHorizontal_bias="1"

        android:visibility="gone" />



    <Constraint

        android:id="@+id/media_logo5"

        android:layout_width="@dimen/qs_media_icon_size"

        android:layout_height="0dp"

        android:translationY="@dimen/qs_media_icon_offset"

        android:translationX="@dimen/qs_media_icon_offset"

        app:layout_constraintEnd_toEndOf="@+id/media_cover5"

        app:layout_constraintBottom_toBottomOf="@+id/media_cover5"

        android:visibility="gone" />



    <Constraint

        android:id="@+id/media_cover6"

        android:layout_width="@dimen/qs_aa_media_rec_album_size"

        android:layout_height="0dp"

        app:layout_constraintTop_toBottomOf="@id/media_cover3"

        app:layout_constraintBottom_toBottomOf="parent"

        app:layout_constraintStart_toEndOf="@id/media_cover5"

        app:layout_constraintEnd_toEndOf="parent"

        app:layout_constraintHorizontal_chainStyle="spread"

        app:layout_constraintHorizontal_bias="1"

        android:visibility="gone" />



    <Constraint

        android:id="@+id/media_logo6"

        android:layout_width="@dimen/qs_media_icon_size"

        android:layout_height="0dp"

        android:translationY="@dimen/qs_media_icon_offset"

        android:translationX="@dimen/qs_media_icon_offset"

        app:layout_constraintEnd_toEndOf="@+id/media_cover6"

        app:layout_constraintBottom_toBottomOf="@+id/media_cover6"

        android:visibility="gone" />



</ConstraintSet>

packages/SystemUI/res/xml/media_recommendation_expanded.xml

0 → 100644
+181 −0
Original line number Diff line number Diff line 
<?xml version="1.0" encoding="utf-8"?>

<!--

  ~ Copyright (C) 2020 The Android Open Source Project

  ~

  ~ 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

  -->

<ConstraintSet

    xmlns:android="http://schemas.android.com/apk/res/android"

    xmlns:app="http://schemas.android.com/apk/res-auto">



    <Constraint

        android:id="@+id/recommendation_card_icon"

        android:layout_width="@dimen/qs_aa_media_rec_header_icon_size"

        android:layout_height="@dimen/qs_aa_media_rec_header_icon_size"

        android:layout_marginTop="@dimen/qs_media_padding"

        android:layout_marginStart="@dimen/qs_aa_media_rec_header_icon_padding"

        app:layout_constraintTop_toTopOf="parent"

        app:layout_constraintStart_toStartOf="parent"

        app:layout_constraintEnd_toStartOf="@id/media_vertical_start_guideline"

        app:layout_constraintHorizontal_bias="0" />



    <Constraint

        android:id="@+id/recommendation_card_text"

        android:layout_width="wrap_content"

        android:layout_height="wrap_content"

        android:layout_marginStart="@dimen/qs_aa_media_rec_header_icon_padding"

        app:layout_constraintTop_toBottomOf="@id/recommendation_card_icon"

        app:layout_constraintStart_toStartOf="parent"

        app:layout_constraintEnd_toStartOf="@id/media_vertical_start_guideline"

        app:layout_constraintHorizontal_bias="0" />



    <Constraint

        android:id="@+id/media_cover1"

        android:layout_width="@dimen/qs_aa_media_rec_album_size"

        android:layout_height="@dimen/qs_aa_media_rec_album_size"

        android:layout_marginTop="@dimen/qs_media_padding"

        app:layout_constraintTop_toTopOf="parent"

        app:layout_constraintBottom_toTopOf="@+id/media_cover4"

        app:layout_constraintStart_toEndOf="@id/media_vertical_start_guideline"

        app:layout_constraintEnd_toStartOf="@id/media_cover2"

        app:layout_constraintHorizontal_chainStyle="spread"

        android:visibility="gone" />



    <Constraint

        android:id="@+id/media_logo1"

        android:layout_width="@dimen/qs_media_icon_size"

        android:layout_height="@dimen/qs_media_icon_size"

        android:translationY="@dimen/qs_media_icon_offset"

        android:translationX="@dimen/qs_media_icon_offset"

        app:layout_constraintEnd_toEndOf="@+id/media_cover1"

        app:layout_constraintBottom_toBottomOf="@+id/media_cover1"

        android:visibility="gone" />



    <Constraint

        android:id="@+id/media_cover2"

        android:layout_width="@dimen/qs_aa_media_rec_album_size"

        android:layout_height="@dimen/qs_aa_media_rec_album_size"

        android:layout_marginTop="@dimen/qs_media_padding"

        app:layout_constraintTop_toTopOf="parent"

        app:layout_constraintBottom_toTopOf="@+id/media_cover5"

        app:layout_constraintStart_toEndOf="@id/media_cover1"

        app:layout_constraintEnd_toStartOf="@id/media_cover3"

        app:layout_constraintHorizontal_chainStyle="spread"

        android:visibility="gone" />



    <Constraint

        android:id="@+id/media_logo2"

        android:layout_width="@dimen/qs_media_icon_size"

        android:layout_height="@dimen/qs_media_icon_size"

        android:translationY="@dimen/qs_media_icon_offset"

        android:translationX="@dimen/qs_media_icon_offset"

        app:layout_constraintEnd_toEndOf="@+id/media_cover2"

        app:layout_constraintBottom_toBottomOf="@+id/media_cover2"

        android:visibility="gone" />



    <Constraint

        android:id="@+id/media_cover3"

        android:layout_width="@dimen/qs_aa_media_rec_album_size"

        android:layout_height="@dimen/qs_aa_media_rec_album_size"

        android:layout_marginTop="@dimen/qs_media_padding"

        app:layout_constraintTop_toTopOf="parent"

        app:layout_constraintBottom_toTopOf="@+id/media_cover6"

        app:layout_constraintStart_toEndOf="@id/media_cover2"

        app:layout_constraintEnd_toEndOf="parent"

        app:layout_constraintHorizontal_chainStyle="spread"

        app:layout_constraintHorizontal_bias="1"

        android:visibility="gone" />



    <Constraint

        android:id="@+id/media_logo3"

        android:layout_width="@dimen/qs_media_icon_size"

        android:layout_height="@dimen/qs_media_icon_size"

        android:translationY="@dimen/qs_media_icon_offset"

        android:translationX="@dimen/qs_media_icon_offset"

        app:layout_constraintEnd_toEndOf="@+id/media_cover3"

        app:layout_constraintBottom_toBottomOf="@+id/media_cover3"

        android:visibility="gone" />



    <Constraint

        android:id="@+id/media_cover4"

        android:layout_width="@dimen/qs_aa_media_rec_album_size"

        android:layout_height="@dimen/qs_aa_media_rec_album_size"

        android:layout_marginTop="@dimen/qs_media_padding"

        android:layout_marginBottom="@dimen/qs_media_padding"

        app:layout_constraintTop_toBottomOf="@+id/media_cover1"

        app:layout_constraintBottom_toBottomOf="parent"

        app:layout_constraintStart_toEndOf="@id/media_vertical_start_guideline"

        app:layout_constraintEnd_toStartOf="@id/media_cover5"

        app:layout_constraintHorizontal_chainStyle="spread"

        app:layout_constraintHorizontal_bias="1"

        android:visibility="gone" />



    <Constraint

        android:id="@+id/media_logo4"

        android:layout_width="@dimen/qs_media_icon_size"

        android:layout_height="@dimen/qs_media_icon_size"

        android:translationY="@dimen/qs_media_icon_offset"

        android:translationX="@dimen/qs_media_icon_offset"

        app:layout_constraintEnd_toEndOf="@+id/media_cover4"

        app:layout_constraintBottom_toBottomOf="@+id/media_cover4"

        android:visibility="gone" />



    <Constraint

        android:id="@+id/media_cover5"

        android:layout_width="@dimen/qs_aa_media_rec_album_size"

        android:layout_height="@dimen/qs_aa_media_rec_album_size"

        android:layout_marginTop="@dimen/qs_media_padding"

        android:layout_marginBottom="@dimen/qs_media_padding"

        app:layout_constraintTop_toBottomOf="@+id/media_cover2"

        app:layout_constraintBottom_toBottomOf="parent"

        app:layout_constraintStart_toEndOf="@+id/media_cover4"

        app:layout_constraintEnd_toStartOf="@+id/media_cover6"

        app:layout_constraintHorizontal_chainStyle="spread"

        app:layout_constraintHorizontal_bias="1"

        android:visibility="gone" />



    <Constraint

        android:id="@+id/media_logo5"

        android:layout_width="@dimen/qs_media_icon_size"

        android:layout_height="@dimen/qs_media_icon_size"

        android:translationY="@dimen/qs_media_icon_offset"

        android:translationX="@dimen/qs_media_icon_offset"

        app:layout_constraintEnd_toEndOf="@+id/media_cover5"

        app:layout_constraintBottom_toBottomOf="@+id/media_cover5"

        android:visibility="gone" />



    <Constraint

        android:id="@+id/media_cover6"

        android:layout_width="@dimen/qs_aa_media_rec_album_size"

        android:layout_height="@dimen/qs_aa_media_rec_album_size"

        android:layout_marginTop="@dimen/qs_media_padding"

        android:layout_marginBottom="@dimen/qs_media_padding"

        app:layout_constraintTop_toBottomOf="@id/media_cover3"

        app:layout_constraintBottom_toBottomOf="parent"

        app:layout_constraintStart_toEndOf="@id/media_cover5"

        app:layout_constraintEnd_toEndOf="parent"

        app:layout_constraintHorizontal_chainStyle="spread"

        app:layout_constraintHorizontal_bias="1"

        android:visibility="gone" />



    <Constraint

        android:id="@+id/media_logo6"

        android:layout_width="@dimen/qs_media_icon_size"

        android:layout_height="@dimen/qs_media_icon_size"

        android:translationY="@dimen/qs_media_icon_offset"

        android:translationX="@dimen/qs_media_icon_offset"

        app:layout_constraintEnd_toEndOf="@+id/media_cover6"

        app:layout_constraintBottom_toBottomOf="@+id/media_cover6"

        android:visibility="gone" />



</ConstraintSet>