Question

当我选择该卡时，我试图在Android Leanback Library中的 ImageCardView 上更改infoArea的背景颜色。目前我尝试过的是改变 OnItemViewSelectedListener 中的背景。这会更改背景，但不会清除之前选择的项目。

private final class ItemViewSelectedListener implements OnItemViewSelectedListener {
        @Override
        public void onItemSelected(Presenter.ViewHolder itemViewHolder, Object item,
                                   RowPresenter.ViewHolder rowViewHolder, Row row) {
            if (item instanceof Video) {
                mBackgroundURI = ((Video) item).getBackgroundImageURI();
                startBackgroundTimer();
                ((ImageCardView) itemViewHolder.view)
                        .setInfoAreaBackgroundColor(getResources().getColor(R.color.dark_blue_grey));
            }
        }
    }

我想实现这样的目标：

desired effect

有什么想法吗？感谢。

Answer 1

我找到了一个更简单的解决方案，我只是跟踪当前选择的视图，然后根据该视图更改背景区域。

private final class ItemViewSelectedListener implements OnItemViewSelectedListener {

        private ImageCardView currentlySelectedView = null;

        @Override
        public void onItemSelected(Presenter.ViewHolder itemViewHolder, Object item,
                                   RowPresenter.ViewHolder rowViewHolder, Row row) {
            if (item instanceof Video) {
                mBackgroundURI = ((Video) item).getBackgroundImageURI();
                startBackgroundTimer();

                if (currentlySelectedView != null) {
                    currentlySelectedView.setInfoAreaBackgroundColor(
                            getResources().getColor(R.color.lb_basic_card_info_bg_color));
                }

                currentlySelectedView = (ImageCardView) itemViewHolder.view;
                currentlySelectedView
                        .setInfoAreaBackgroundColor(getResources().getColor(R.color.dark_blue_grey));
            }
        }
    }

Answer 2

我通过扩展ImageCardView来实现这一目的，以保持自定义选定颜色。

public static class CustomImageCardView extends ImageCardView {

    private int mColor;

    public CustomImageCardView(Context context) {
        super(context);
    }

    public CustomImageCardView(Context context, AttributeSet attrs) {
        super(context, attrs);
    }

    public CustomImageCardView(Context context, AttributeSet attrs, int defStyle) {
        super(context, attrs, defStyle);
    }

    public int getCustomSelectedSwatch() {
        return mColor;
    }

    public void setCustomColor(int color) {
        mColor = color;
    }
}

我保持默认背景颜色，默认选择颜色作为演示者中的成员变量。

private final int mDefaultInfoBackgroundColor;
private final int mDefaultSelectedInfoBackgroundColor;

并覆盖卡片图片视图的setSelected方法：

@Override
public ViewHolder onCreateViewHolder(ViewGroup parent) {
    mContext = parent.getContext();

    final CustomImageCardView cardView = new CustomImageCardView(mContext) {
        @Override
        public void setSelected(boolean selected) {
            if (getCustomColor() != 0 && selected) {
                setInfoAreaBackgroundColor(getCustomColor());
            } else setInfoAreaBackgroundColor(selected ? mDefaultSelectedInfoBackgroundColor : mDefaultInfoBackgroundColor);
            super.setSelected(selected);
        }
    };

    cardView.setFocusable(true);
    cardView.setFocusableInTouchMode(true);
    return new ViewHolder(cardView);
}

如果您有任何疑问，请与我联系！

Answer 3

如果您希望动态更改聚焦卡片视图的视觉样式，可以在ImageCardView上设置OnFocusChangeListener。完整示例可以在Google Samples leanback-showcase项目中找到。

这是一个简短的例子，在你的ImageCardViewPresenter类中输入如下内容：

@Override
public Presenter.ViewHolder onCreateViewHolder(ViewGroup parent) {
    Context context = parent.getContext();

    ImageCardView cardView = new ImageCardView(context);
    cardView.setFocusable(true);
    cardView.setFocusableInTouchMode(true);

    cardView.setOnFocusChangeListener(new View.OnFocusChangeListener() {
        @Override
        public void onFocusChange(View v, boolean hasFocus) {
            if (hasFocus) {
                // Set bg color for the whole card
                cardView.setBackgroundColor(ContextCompat.getColor(context, R.color.FOCUSED_COLOR));
                // Set bg color for the info area only
                cardView.setInfoAreaBackgroundColor(ContextCompat.getColor(context, R.color.FOCUSED_COLOR));
                // Set title text color
                ((TextView) cardView.findViewById(R.id.title_text)).setTextColor(ContextCompat.getColor(context, R.color.FOCUSED_COLOR));
                // Set description text color
                ((TextView) cardView.findViewById(R.id.content_text)).setTextColor(ContextCompat.getColor(context, R.color.FOCUSED_COLOR));
            } 
            else {
                cardView.setBackgroundColor(ContextCompat.getColor(context, R.color.NORMAL_COLOR));
                cardView.setInfoAreaBackgroundColor(ContextCompat.getColor(context, R.color.NORMAL_COLOR));
                ((TextView) cardView.findViewById(R.id.title_text)).setTextColor(ContextCompat.getColor(context, R.color.NORMAL_COLOR));
                ((TextView) cardView.findViewById(R.id.content_text)).setTextColor(ContextCompat.getColor(context, R.color.NORMAL_COLOR));
            }
        }
    });

    return new ViewHolder(cardView);
}

要获取所有卡片子视图的正确布局ID，请查看XML源代码，例如：lb_image_card_view.xml

如何更改ImageCardView上信息区域的背景颜色？

3 个答案: