将CardView置于RecyclerView中,只有一个元素

Question

我正在使用包含带有TextView和ImageView的CardView的RecyclerView(每张卡代表一个城市).我在每张卡片上都有一个onClickListener,可以将我带到城市的博物馆列表中.(RecyclerView由ArrayList填充).该列表是由垂直滚动的同一Cardview组成的RecyclerView.

当一个城市只有一个博物馆时,如何在屏幕中央显示独特的CardView？

这是活动xml:

    <?xml version="1.0" encoding="utf-8"?>
 <RelativeLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    tools:context="com.bebbo203.mymuseum.MuseumActivity">

    <android.support.v7.widget.RecyclerView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:id="@+id/recyclerViewMuseum"
        android:scrollbars="vertical"
        android:scrollIndicators="none"
        android:gravity="center_horizontal"
        />
</RelativeLayout>

这是RecyclerView xml:

 <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
              android:layout_width="match_parent"
              android:layout_height="match_parent"
              android:baselineAligned="false"
              xmlns:card_view="http://schemas.android.com/apk/res-auto">

    <android.support.v7.widget.CardView
        xmlns:card_view="http://schemas.android.com/apk/res-auto"
        android:layout_width="match_parent"
        android:layout_height="150dp"
        android:id="@+id/cardView"
        card_view:cardCornerRadius="2dp"
        card_view:cardUseCompatPadding="true"
        android:gravity="center_horizontal"
        android:animateLayoutChanges="true"
        >
        <FrameLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent">

            <ImageView
                android:layout_width="match_parent"
                android:layout_height="150dp"
                android:id="@+id/imageViewList"
                android:layout_gravity="center_horizontal|top"
                android:adjustViewBounds="true"
                android:scaleType="centerCrop"/>

            <TextView
                android:id="@+id/textViewList"
                android:layout_width="match_parent"
                android:layout_height="150dp"
                android:textSize="40sp"
                android:textIsSelectable="false"
                android:textAlignment="center"
                android:gravity="fill"
                android:textStyle="bold"
                android:layout_weight="1"
                android:layout_gravity="center_horizontal|top"/>

        </FrameLayout>

    </android.support.v7.widget.CardView>


</RelativeLayout>`

谢谢你的帮助.

所以这就是MainActivity.城市列表.一切都很好.

当我点击只有一个博物馆的Parigi时,我想在屏幕中央显示单个卡片视图

(如果有可能我想从屏幕中心开始,而不是从顶部开始.如果我打开活动时中央卡片视图始终位于中心.例如,在中心翻译NationalGallery另一个的顺序)

Answer 1

我已经实现了简单的HelloWorld应用程序,该应用程序显示城市列表并根据它拥有的博物馆数量 - 显示全尺寸城市卡或其中心包装版本.

(是的,我不擅长艺术:-))

这就是我做到的.

TL; DR:

关键部分是ItemDecoration:设置适当的物品抵消,你会得到你需要的东西; 这是我如何做到的:

    RecyclerView recyclerViewMuseum = (RecyclerView)findViewById(R.id.recyclerViewMuseum);
    recyclerViewMuseum.setLayoutManager(new LinearLayoutManager(this, LinearLayoutManager.VERTICAL, false));
    recyclerViewMuseum.setAdapter(adapter);
    recyclerViewMuseum.addItemDecoration(new RecyclerView.ItemDecoration() {

        @Override
        public void getItemOffsets(Rect outRect, View view, RecyclerView parent, RecyclerView.State state) {
            if (view instanceof CityWithOneMuseumCardView) {
                int totalWidth = parent.getWidth();
                int cardWidth = getResources().getDimensionPixelOffset(R.dimen.small_card_width);
                int sidePadding = (totalWidth - cardWidth) / 2;
                sidePadding = Math.max(0, sidePadding);
                outRect.set(sidePadding, 0, sidePadding, 0);
            }
        }
    });

这是我的模型 - City和Museum类:

public class Museum {
    public String title;
    public Museum(String title) {
        this.title = title;
    }
}

public class City {
    public String title;
    public int imageRes;
    public List<Museum> museums = new ArrayList<>();

    public City(String title, int imageRes) {
        this.title = title;
        this.imageRes = imageRes;
    }
}

然后观看:CityWithManyMuseumsCardView和CityWithOneMuseumCardView.他们都使用helper-interface IItemDisplayer.

public class CityWithOneMuseumCardView extends CardView implements IItemDisplayer<City> {

    public CityWithOneMuseumCardView(Context context) {
        super(context);
        LayoutInflater.from(context).inflate(R.layout.one_museum_layout, this);
    }

    @Override
    public void displayItem(City city) {
        TextView cityTitleTextView = (TextView)findViewById(R.id.cityTitleTextView);
        cityTitleTextView.setText(city.title);
    }
}

public class CityWithManyMuseumsCardView extends CardView implements IItemDisplayer<City> {

    public CityWithManyMuseumsCardView(Context context) {
        super(context);
        LayoutInflater.from(context).inflate(R.layout.many_museums_layout, this);
    }

    @Override
    public void displayItem(City city) {
        ImageView cityBackgroundImageView = (ImageView)findViewById(R.id.cityBackgroundImageView);
        cityBackgroundImageView.setImageResource(city.imageRes);
        TextView cityTitleTextView = (TextView)findViewById(R.id.cityTitleTextView);
        cityTitleTextView.setText(city.title);
        TextView cityNumberOrMuseumsTextView = (TextView)findViewById(R.id.cityNumberOrMuseumsTextView);
        cityNumberOrMuseumsTextView.setText(String.valueOf(city.museums.size()));
    }
}

public interface IItemDisplayer<TItem> {
    public void displayItem(TItem item);
}

他们的布局:

<!-- One Museum card -->
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:background="#BB2050AB"
    android:layout_width="@dimen/small_card_width"
    android:layout_height="200dp">

    <TextView
        android:background="#AA000000"
        android:textColor="#FFFFFF"
        android:text="Only one museum available"
        android:textSize="16sp"
        android:padding="4dp"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" />

    <TextView
        android:id="@+id/cityTitleTextView"
        android:layout_gravity="bottom"
        android:background="#AAFFFFFF"
        android:textColor="#000000"
        android:textSize="24sp"
        android:paddingStart="16dp"
        android:paddingEnd="16dp"
        android:gravity="center"
        android:layout_width="match_parent"
        android:layout_height="48dp" />
</FrameLayout>

<!-- Many museums card -->
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="240dp">
    <ImageView
        android:id="@+id/cityBackgroundImageView"
        android:scaleType="fitXY"
        android:layout_width="500dp"
        android:layout_height="match_parent" />

    <TextView
        android:id="@+id/cityNumberOrMuseumsTextView"
        android:layout_gravity="top|end"
        android:background="#AA000000"
        android:textColor="#FFFFFF"
        android:textSize="16sp"
        android:padding="4dp"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" />

    <TextView
        android:id="@+id/cityTitleTextView"
        android:layout_gravity="bottom"
        android:background="#AA000000"
        android:textColor="#FFFFFF"
        android:textSize="24sp"
        android:paddingStart="16dp"
        android:paddingEnd="16dp"
        android:gravity="center_vertical"
        android:layout_width="match_parent"
        android:layout_height="48dp" />
</FrameLayout>

然后我们需要为我们创建一个适配器 RecyclerView CityAdapter.java

public class CityAdapter  extends RecyclerView.Adapter<RecyclerView.ViewHolder> {

    final static int ITEM_TYPE_MANY_MUSEUMS = 0;
    final static int ITEM_TYPE_ONE_MUSEUM = 1;

    private List<City> items;

    public CityAdapter(List<City> items) {
        this.items = items;
    }

    @Override
    public RecyclerView.ViewHolder onCreateViewHolder(ViewGroup viewGroup, int viewType) {
        switch (viewType) {
            case ITEM_TYPE_MANY_MUSEUMS:
                return new ViewHolder(new CityWithManyMuseumsCardView(viewGroup.getContext()));
            case ITEM_TYPE_ONE_MUSEUM:
                return new ViewHolder(new CityWithOneMuseumCardView(viewGroup.getContext()));
            default:
                throw new IllegalArgumentException(String.format("Unexpected viewType: %d", viewType));
        }
    }

    @Override
    public int getItemViewType(int position) {
        if (items == null || items.size() < position) {
            throw new IllegalArgumentException("Wrong position!");
        }

        if (items.get(position).museums.size() > 1) {
            return ITEM_TYPE_MANY_MUSEUMS;
        } else if (items.get(position).museums.size() == 1){
            return ITEM_TYPE_ONE_MUSEUM;
        }

        throw new IllegalArgumentException("Wrong number of museums!");
    }

    @Override
    public void onBindViewHolder(RecyclerView.ViewHolder holder, int position) {
        ((IItemDisplayer<City>) holder.itemView).displayItem(items.get(position));
    }

    @Override
    public int getItemCount() {
        return items.size();
    }

    public class ViewHolder extends RecyclerView.ViewHolder {

        public ViewHolder(View itemView) {
            super(itemView);
        }
    }
}

我已将此项目上传到我的Dropbox - 随时查看!希望能帮助到你.