如何使用RecyclerView创建一个Horizo​​ntal CardView,一次只有一张卡在屏幕上

时间:2015-03-20 16:30:08

标签: android android-recyclerview horizontallist

我是Android开发的新手。我试图在屏幕上显示卡片列表,只需使用 RecyclerView 在屏幕上显示一张卡片。但遗憾的是,我设计的卡片没有按预期填充整个屏幕宽度,正如您在下面给出的图像中看到的那样。 如何拉伸这些卡片以填充整个屏幕(宽度方面,高度是包装内容)。 有没有解决这个问题的方法?

我的代码:

activity_sub.xml

   <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">

<include
    android:id="@+id/appBar"
    layout="@layout/app_bar"/>

    <TextView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="Horizontal Card List"
        android:textSize="16sp"
        android:padding="3dp"
        android:background="#CCCCCC" />

    <android.support.v7.widget.RecyclerView
        android:id="@+id/hrlist_recycler_view"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:scrollbars="horizontal" />

</LinearLayout>

custom_card.xml

 <?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:orientation="vertical"
    android:padding="8dp"
    android:tag="contains Cards main Container">

    <android.support.v7.widget.CardView xmlns:android="http://schemas.android.com/apk/res/android"
        xmlns:app="http://schemas.android.com/apk/res-auto"
        android:id="@+id/card_view"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:elevation="10dp"
        app:cardBackgroundColor="#B6B6B6">

        <TextView
            android:id="@+id/card_text"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="center_vertical"
            android:padding="20dp"
            android:text="Card 1"
            android:textSize="30sp" />

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

SubActivity.java

package ab9.mamv.com.playground;

import android.os.Bundle;
import android.support.v4.app.NavUtils;
import android.support.v7.app.ActionBarActivity;
import android.support.v7.widget.LinearLayoutManager;
import android.support.v7.widget.RecyclerView;
import android.support.v7.widget.Toolbar;
import android.view.Menu;
import android.view.MenuItem;

import java.util.ArrayList;
import java.util.List;


public class SubActivity extends ActionBarActivity {

    Toolbar toolbar;

    private RecyclerView mRecyclerView;
    private SubActivityAdapter mAdapter;
    private RecyclerView.LayoutManager mLayoutManager;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_sub);

        toolbar = (Toolbar) findViewById(R.id.appBar);
        setSupportActionBar(toolbar);

        getSupportActionBar().setHomeButtonEnabled(true);
        getSupportActionBar().setDisplayHomeAsUpEnabled(true);

        //RecyclerView
        mRecyclerView = (RecyclerView) findViewById(R.id.hrlist_recycler_view);
        mRecyclerView.setHasFixedSize(true);

        mAdapter = new SubActivityAdapter(this, getData());
        mRecyclerView.setAdapter(mAdapter);

        //Layout manager for the Recycler View
        mLayoutManager = new LinearLayoutManager(this, LinearLayoutManager.HORIZONTAL, false);
        mRecyclerView.setLayoutManager(mLayoutManager);


    }

    public static List<SubActivityData> getData() {
        List<SubActivityData> subActivityData = new ArrayList<>();
        String[] cardTitle = {
                "Card 1",
                "Card 2",
                "Card 3",
                "Card 4",
                "Card 5",
                "Card 6",
        };
        for (int i = 0; i < cardTitle.length; i++) {
            SubActivityData current = new SubActivityData();
            current.cardTitle = cardTitle[i];
            subActivityData.add(current);
        }

        return subActivityData;
    }


    @Override
    public boolean onCreateOptionsMenu(Menu menu) {
        // Inflate the menu; this adds items to the action bar if it is present.
        getMenuInflater().inflate(R.menu.menu_sub, menu);
        return true;
    }

    @Override
    public boolean onOptionsItemSelected(MenuItem item) {
        // Handle action bar item clicks here. The action bar will
        // automatically handle clicks on the Home/Up button, so long
        // as you specify a parent activity in AndroidManifest.xml.
        int id = item.getItemId();

        //noinspection SimplifiableIfStatement
        if (id == R.id.action_settings) {
            return true;
        }

        if (id == android.R.id.home) {
            NavUtils.navigateUpFromSameTask(this);
        }

        return super.onOptionsItemSelected(item);
    }
}

SubActivityAdapter.java

package ab9.mamv.com.playground;

import android.content.Context;
import android.support.v7.widget.RecyclerView;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.TextView;

import java.util.Collections;
import java.util.List;

/**
 * Created by Abhishek on 20-03-2015.
 */
public class SubActivityAdapter extends RecyclerView.Adapter<SubActivityAdapter.SubActivityViewHolder> {

    private final LayoutInflater inflater;
    List<SubActivityData> subActivityData = Collections.EMPTY_LIST;

    public SubActivityAdapter(Context context, List<SubActivityData> subActivityData) {
        inflater = LayoutInflater.from(context);
        this.subActivityData = subActivityData;
    }


    @Override
    public SubActivityViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {

        View view = inflater.inflate(R.layout.custom_card, parent, false);
        SubActivityViewHolder subActivityViewHolder = new SubActivityViewHolder(view);
        return subActivityViewHolder;
    }

    @Override
    public void onBindViewHolder(SubActivityViewHolder holder, int position) {
        SubActivityData currentCard = subActivityData.get(position);
        holder.title.setText(currentCard.cardTitle);

    }

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

    class SubActivityViewHolder extends RecyclerView.ViewHolder {

        TextView title;

        public SubActivityViewHolder(View itemView) {
            super(itemView);

            title = (TextView) itemView.findViewById(R.id.card_text);
        }
    }
}

enter image description here

3 个答案:

答案 0 :(得分:12)

只需将onCreateViewHolder更改为:

<input type="date"  />
<input type="date"  max="{{ctrl.maxDate"}}/>

此后您可能需要处理custom_card.xml。但它应该做到这一点。

答案 1 :(得分:1)

尽管这个问题以及许多其他类似的问题已经发布很久了,但我找不到任何单一的工作方法。

这是一个简单的修复方法

RecyclerView rv = (RecyclerView) findViewById(R.id.swipeView);;
rv.addOnScrollListener(new RecyclerView.OnScrollListener() {

@Override
public void onScrolled(RecyclerView recyclerView, int dx, int dy) {
    super.onScrolled(recyclerView, dx, dy);
    LinearLayoutManager layoutManager = (LinearLayoutManager) recyclerView.getLayoutManager();
    if (dx >= 0) {
        recyclerView.smoothScrollToPosition(layoutManager.findLastVisibleItemPosition());
    } else {
        recyclerView.smoothScrollToPosition(layoutManager.findFirstVisibleItemPosition());
    }
}
});

您可以为更具吸引力的互换添加dx阈值。

答案 2 :(得分:-2)

按照下面的教程,将CardView的宽度和高度更改为“match_parent”,一次只能在屏幕上显示一张卡

https://knowledgecollisions.wordpress.com/2016/03/29/using-recyclerview-and-cardview-in-your-android-app/