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

Commit e75ba2d6 authored by cecilia's avatar cecilia Committed by Cecilia Hong
Browse files

Update the media recommendation card UI for only showing recs from one

app.

Screenshots for new UI:
- http://screen/4zcR4ofEhA5tT3Z;
- http://screen/7SSKm6KkMFWEknM.

Also adjusted to make the layout fits the zoomed-in display.
Before fixes:
- http://screen/96aPMjUE5WC8thb;
- http://screen/6oFuAcemQ9PqnBa.
After fixes:
- http://screen/8F72QZ3SeXSSgV6;
- http://screen/5jfwr7GWuFoNJry.

Bug: 187944091
Fixes: 187827805
Test: Local builds
Change-Id: Id64a336891b45c39d14ce5f3b858cf1f019aa9fe
parent 6737deac
Loading
Loading
Loading
Loading
+20 −54
Original line number Diff line number Diff line
@@ -46,117 +46,83 @@

    <com.android.internal.widget.CachingIconView
        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_width="@dimen/qs_media_icon_size"
        android:layout_height="@dimen/qs_media_icon_size"
        android:src="@drawable/ic_headset"
        android:tint="?android:attr/textColor" />
        style="@style/MediaPlayer.AppIcon"/>

    <TextView
        android:id="@+id/recommendation_card_text"
        android:layout_width="wrap_content"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:singleLine="true"
        android:maxLines="2"
        android:text="@string/controls_media_smartspace_rec_title"
        android:fontFamily="google-sans-medium"
        android:textDirection="locale"
        android:textSize="@dimen/qq_aa_media_rec_header_text_size" />
        android:textSize="@dimen/qq_aa_media_rec_header_text_size"
        android:breakStrategy="balanced"
        android:hyphenationFrequency="none"/>

    <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:layout_width="0dp"
        android:layout_height="@dimen/qs_aa_media_rec_album_size_collapsed"
        android:adjustViewBounds="true"
        android:background="@drawable/bg_smartspace_media_item"
        style="@style/MediaPlayer.Album"
        android:clipToOutline="true"
        android:scaleType="centerCrop"/>

    <com.android.internal.widget.CachingIconView
        android:id="@+id/media_logo1"
        android:layout_width="@dimen/qs_media_icon_size"
        android:layout_height="@dimen/qs_media_icon_size"
        style="@style/MediaPlayer.AppIcon" />

    <ImageView
        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_width="0dp"
        android:layout_height="@dimen/qs_aa_media_rec_album_size_collapsed"
        android:adjustViewBounds="true"
        android:background="@drawable/bg_smartspace_media_item"
        style="@style/MediaPlayer.Album"
        android:clipToOutline="true"
        android:scaleType="centerCrop"/>

    <com.android.internal.widget.CachingIconView
        android:id="@+id/media_logo2"
        android:layout_width="@dimen/qs_media_icon_size"
        android:layout_height="@dimen/qs_media_icon_size"
        style="@style/MediaPlayer.AppIcon" />

    <ImageView
        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_width="0dp"
        android:layout_height="@dimen/qs_aa_media_rec_album_size_collapsed"
        android:adjustViewBounds="true"
        android:background="@drawable/bg_smartspace_media_item"
        style="@style/MediaPlayer.Album"
        android:clipToOutline="true"
        android:scaleType="centerCrop"/>

    <com.android.internal.widget.CachingIconView
        android:id="@+id/media_logo3"
        android:layout_width="@dimen/qs_media_icon_size"
        android:layout_height="@dimen/qs_media_icon_size"
        style="@style/MediaPlayer.AppIcon" />

    <ImageView
        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_width="0dp"
        android:layout_height="@dimen/qs_aa_media_rec_album_size_collapsed"
        android:adjustViewBounds="true"
        android:background="@drawable/bg_smartspace_media_item"
        style="@style/MediaPlayer.Album"
        android:clipToOutline="true"
        android:scaleType="centerCrop"/>

    <com.android.internal.widget.CachingIconView
        android:id="@+id/media_logo4"
        android:layout_width="@dimen/qs_media_icon_size"
        android:layout_height="@dimen/qs_media_icon_size"
        style="@style/MediaPlayer.AppIcon" />

    <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:layout_width="0dp"
        android:layout_height="@dimen/qs_aa_media_rec_album_size_collapsed"
        android:adjustViewBounds="true"
        android:background="@drawable/bg_smartspace_media_item"
        style="@style/MediaPlayer.Album"
        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"
        style="@style/MediaPlayer.AppIcon" />

    <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:layout_width="0dp"
        android:layout_height="@dimen/qs_aa_media_rec_album_size_collapsed"
        android:adjustViewBounds="true"
        android:background="@drawable/bg_smartspace_media_item"
        style="@style/MediaPlayer.Album"
        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"
        style="@style/MediaPlayer.AppIcon" />

    <!-- Long press menu -->
    <TextView
        android:layout_width="wrap_content"
+3 −4
Original line number Diff line number Diff line
@@ -1277,10 +1277,9 @@
    <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_header_icon_start_margin">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="qs_aa_media_rec_album_vertical_margin">8dp</dimen>
    <dimen name="qs_aa_media_rec_album_size_collapsed">66dp</dimen>
    <dimen name="qs_aa_media_rec_album_size_expanded">80dp</dimen>
    <dimen name="qs_aa_media_rec_album_margin">8dp</dimen>
    <dimen name="qq_aa_media_rec_header_text_size">16sp</dimen>

    <!-- Window magnification -->
+29 −81
Original line number Diff line number Diff line
@@ -20,10 +20,9 @@

    <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_width="@dimen/qs_media_icon_size"
        android:layout_height="@dimen/qs_media_icon_size"
        android:layout_marginTop="@dimen/qs_media_padding"
        android:layout_marginStart="@dimen/qs_aa_media_rec_header_icon_start_margin"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintEnd_toStartOf="@id/media_vertical_start_guideline"
@@ -31,9 +30,8 @@

    <Constraint
        android:id="@+id/recommendation_card_text"
        android:layout_width="wrap_content"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginStart="@dimen/qs_aa_media_rec_header_icon_start_margin"
        app:layout_constraintTop_toBottomOf="@id/recommendation_card_icon"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintEnd_toStartOf="@id/media_vertical_start_guideline"
@@ -41,137 +39,87 @@

    <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_width="0dp"
        android:layout_height="@dimen/qs_aa_media_rec_album_size_collapsed"
        app:layout_constraintWidth_max="@dimen/qs_aa_media_rec_album_size_collapsed"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintBottom_toBottomOf="parent"
        android:layout_marginTop="@dimen/qs_media_padding"
        android:layout_marginBottom="@dimen/qs_media_padding"
        android:layout_marginEnd="@dimen/qs_aa_media_rec_album_margin"
        app:layout_constraintStart_toEndOf="@id/media_vertical_start_guideline"
        app:layout_constraintEnd_toStartOf="@id/media_cover2"
        app:layout_constraintHorizontal_chainStyle="spread"
        app:layout_constraintVertical_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"
        app:layout_constraintHorizontal_chainStyle="packed"
        app:layout_constraintHorizontal_bias="1"
        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_width="0dp"
        android:layout_height="@dimen/qs_aa_media_rec_album_size_collapsed"
        app:layout_constraintWidth_max="@dimen/qs_aa_media_rec_album_size_collapsed"
        android:layout_marginTop="@dimen/qs_media_padding"
        android:layout_marginBottom="@dimen/qs_media_padding"
        android:layout_marginEnd="@dimen/qs_aa_media_rec_album_margin"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintBottom_toBottomOf="parent"
        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"
        app:layout_constraintHorizontal_chainStyle="packed"
        app:layout_constraintHorizontal_bias="1"
        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_width="0dp"
        android:layout_height="@dimen/qs_aa_media_rec_album_size_collapsed"
        app:layout_constraintWidth_max="@dimen/qs_aa_media_rec_album_size_collapsed"
        android:layout_marginTop="@dimen/qs_media_padding"
        android:layout_marginBottom="@dimen/qs_media_padding"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintStart_toEndOf="@id/media_cover2"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHorizontal_chainStyle="spread"
        app:layout_constraintHorizontal_chainStyle="packed"
        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_width="0dp"
        android:layout_height="0dp"
        android:layout_marginEnd="@dimen/qs_aa_media_rec_album_margin"
        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"
        android:visibility="gone" />

    <Constraint
        android:id="@+id/media_logo4"
        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"
        app:layout_constraintHorizontal_chainStyle="packed"
        app:layout_constraintHorizontal_bias="1"
        android:visibility="gone" />

    <Constraint
        android:id="@+id/media_cover5"
        android:layout_width="@dimen/qs_aa_media_rec_album_size"
        android:layout_width="0dp"
        android:layout_height="0dp"
        android:layout_marginEnd="@dimen/qs_aa_media_rec_album_margin"
        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"
        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"
        app:layout_constraintHorizontal_chainStyle="packed"
        app:layout_constraintHorizontal_bias="1"
        android:visibility="gone" />

    <Constraint
        android:id="@+id/media_cover6"
        android:layout_width="@dimen/qs_aa_media_rec_album_size"
        android:layout_width="0dp"
        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_chainStyle="packed"
        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>
+47 −95

File changed.

Preview size limit exceeded, changes collapsed.

+59 −32
Original line number Diff line number Diff line
@@ -23,6 +23,7 @@ import android.app.smartspace.SmartspaceAction;
import android.app.smartspace.SmartspaceTarget;
import android.content.Context;
import android.content.Intent;
import android.content.pm.ApplicationInfo;
import android.content.pm.PackageManager;
import android.content.res.ColorStateList;
import android.graphics.ColorMatrix;
@@ -511,10 +512,31 @@ public class MediaControlPanel {
            return;
        }

        // Set up recommendation card's header.
        ApplicationInfo applicationInfo = getApplicationInfo(target);
        if (applicationInfo == null) {
            Log.w(TAG, "No valid application info is found for media recommendations");
            return;
        }

        PackageManager packageManager = mContext.getPackageManager();
        // Set up media source app's logo.
        Drawable icon = packageManager.getApplicationIcon(applicationInfo);
        icon.setColorFilter(getGrayscaleFilter());
        ImageView headerLogoImageView = mRecommendationViewHolder.getCardIcon();
        headerLogoImageView.setImageDrawable(icon);
        // Set up media source app's label text. Fallback to "Play" if the found label is empty.
        CharSequence appLabel = packageManager.getApplicationLabel(applicationInfo);
        if (appLabel.length() != 0) {
            TextView headerTitleText = mRecommendationViewHolder.getCardText();
            headerTitleText.setText(appLabel);
        }
        // Set up media card's tap action if applicable.
        setSmartspaceRecItemOnClickListener(
                mRecommendationViewHolder.getRecommendations(), target.getBaseAction());

        List<ImageView> mediaCoverItems = mRecommendationViewHolder.getMediaCoverItems();
        List<ImageView> mediaLogoItems = mRecommendationViewHolder.getMediaLogoItems();
        List<Integer> mediaCoverItemsResIds = mRecommendationViewHolder.getMediaCoverItemsResIds();
        List<Integer> mediaLogoItemsResIds = mRecommendationViewHolder.getMediaLogoItemsResIds();
        ConstraintSet expandedSet = mMediaViewController.getExpandedLayout();
        ConstraintSet collapsedSet = mMediaViewController.getCollapsedLayout();
        int mediaRecommendationNum = Math.min(mediaRecommendationList.size(),
@@ -528,50 +550,22 @@ public class MediaControlPanel {
                continue;
            }

            // Get media source app's logo.
            Bundle extras = recommendation.getExtras();
            Drawable icon = null;
            if (extras != null && extras.getString(EXTRAS_MEDIA_SOURCE_PACKAGE_NAME) != null) {
                // Get the logo from app's package name when applicable.
                String packageName = extras.getString(EXTRAS_MEDIA_SOURCE_PACKAGE_NAME);
                try {
                    icon = mContext.getPackageManager().getApplicationIcon(
                            packageName);
                    icon.setColorFilter(getGrayscaleFilter());
                } catch (PackageManager.NameNotFoundException e) {
                    Log.w(TAG, "No media source icon can be fetched via package name", e);
                }
            } else {
                Log.w(TAG, "No media source icon is provided. Skipping this item...");
                continue;
            }

            // Set up media source app's logo.
            ImageView mediaSourceLogoImageView = mediaLogoItems.get(uiComponentIndex);
            mediaSourceLogoImageView.setImageDrawable(icon);

            // Set up media item cover.
            ImageView mediaCoverImageView = mediaCoverItems.get(uiComponentIndex);
            mediaCoverImageView.setImageIcon(recommendation.getIcon());

            // Set up the click listener if applicable.
            // Set up the media item's click listener if applicable.
            setSmartspaceRecItemOnClickListener(mediaCoverImageView, recommendation);

            if (uiComponentIndex < MEDIA_RECOMMENDATION_ITEMS_PER_ROW) {
                setVisibleAndAlpha(collapsedSet,
                        mediaCoverItemsResIds.get(uiComponentIndex), true);
                setVisibleAndAlpha(collapsedSet,
                        mediaLogoItemsResIds.get(uiComponentIndex), true);
            } else {
                setVisibleAndAlpha(collapsedSet,
                        mediaCoverItemsResIds.get(uiComponentIndex), false);
                setVisibleAndAlpha(collapsedSet,
                        mediaLogoItemsResIds.get(uiComponentIndex), false);
            }
            setVisibleAndAlpha(expandedSet,
                    mediaCoverItemsResIds.get(uiComponentIndex), true);
            setVisibleAndAlpha(expandedSet,
                    mediaLogoItemsResIds.get(uiComponentIndex), true);

            uiComponentIndex++;
        }
@@ -681,7 +675,8 @@ public class MediaControlPanel {
    private void setSmartspaceRecItemOnClickListener(
            @NonNull View view,
            @NonNull SmartspaceAction action) {
        if (view == null || action == null || action.getIntent() == null) {
        if (view == null || action == null || action.getIntent() == null
                || action.getIntent().getExtras() == null) {
            Log.e(TAG, "No tap action can be set up");
            return;
        }
@@ -731,6 +726,38 @@ public class MediaControlPanel {
        return false;
    }

    /**
     * Returns the application info for the media recommendation's source app.
     *
     * @param target Smartspace target contains a list of media recommendations. Each item should
     *               contain the same source app's info.
     *
     * @return The source app's application info. This value can be null if no valid application
     * info can be obtained.
     */
    private ApplicationInfo getApplicationInfo(@NonNull SmartspaceTarget target) {
        List<SmartspaceAction> mediaRecommendationList = target.getIconGrid();
        if (mediaRecommendationList == null || mediaRecommendationList.isEmpty()) {
            return null;
        }

        for (SmartspaceAction recommendation: mediaRecommendationList) {
            Bundle extras = recommendation.getExtras();
            if (extras != null && extras.getString(EXTRAS_MEDIA_SOURCE_PACKAGE_NAME) != null) {
                // Get the logo from app's package name when applicable.
                String packageName = extras.getString(EXTRAS_MEDIA_SOURCE_PACKAGE_NAME);
                try {
                    return mContext.getPackageManager()
                            .getApplicationInfo(packageName, 0 /* flags */);
                } catch (PackageManager.NameNotFoundException e) {
                    Log.w(TAG, "Fail to get media recommendation's app info", e);
                }
            }
        }

        return null;
    }

    /**
     * Get the surface given the current end location for MediaViewController
     * @return surface used for Smartspace logging
Loading