使用 cardslib 自定义卡片的准确方法是什么？

Question

我在文件中声明了一张卡 cardslib_item_card_view:

<it.gmariotti.cardslib.library.view.CardViewNative     
  xmlns:android="http://schemas.android.com/apk/res/android"
  xmlns:card="http://schemas.android.com/apk/res-auto"
  xmlns:card_view="http://schemas.android.com/apk/res-auto"
  card_view:cardCornerRadius="4dp"
  style="@style/native_recyclerview_card.base"
  android:id="@+id/carddemo"
  android:layout_width="match_parent" android:layout_height="wrap_content">

并在 onCreate() 方法中设置为内容视图：

public class CardMariotti extends ActionBarActivity{
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.cardslib_item_card_view);
        //Create a Card
        Card card = new Card(this);
        CardViewNative cardView = (CardViewNative) this.findViewById(R.id.carddemo);
        cardView.setCard(card);

        card.setOnClickListener(new Card.OnCardClickListener() {
            @Override
            public void onClick(Card card, View view) {
                Toast.makeText(CardMariotti.this, "Clickable card", Toast.LENGTH_LONG).show();
            }
        });
}

现在，我想用我自己的布局来定制它，包含一个窄header和一些信息，如下：

<RelativeLayout  android:id="@+id/cardlayout"
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent" android:layout_height="match_parent"
    android:background="?android:selectableItemBackground"    
    android:clickable="true">

    <!-- layout containing 3 TextView -->
</RelativeLayout> 

这种过程的规范程序是什么？我尝试了很多调整，即：

• 创建第二个名为 cardslib_item_layout.xml 的 xml 文件并通过 Card 的构造函数引用它：Card card = new Card(this, R.layout.cardslib_item_layout); 然后设置 setContentView(R.layout.cardslib_item_card_view)
• 在卡片中附加布局，然后设置 setContentView(R.layout.cardslib_item_card_view)。

这边； cardslib_item_card_view:

<it.gmariotti.cardslib.library.view.CardViewNative     
      xmlns:android="http://schemas.android.com/apk/res/android"
      xmlns:card="http://schemas.android.com/apk/res-auto" 
      xmlns:card_view="http://schemas.android.com/apk/res-auto"
      card_view:cardCornerRadius="4dp"
      android:id="@+id/carddemo"
      android:layout_width="match_parent" android:layout_height="wrap_content">

      <RelativeLayout>
          <!-- my layout containing a header and some TextViews -->
      </RelativeLayout>
</it.gmariotti.cardslib.library.view.CardViewNative>

在这两个测试中，我都遇到了以下问题：

• 整体结果完全扭曲
• 最重要的是，RelativeLayout 位于卡片的顶部，因此无法对卡片进行任何操作（例如，在卡片本身上设置 Card.OnCardClickListener 将不起作用，因为用户将点击RelativeLayout 而不是卡片本身）

尝试 1： 尝试 2：

规范程序是什么？

EDIT2: ANSWER

The contribution given by @Msk worked fine for me, although I discovered later that with some minor changes it is also possible to obtain the same results by using the original cardslib's Card class, without resorting to the creation of a new class DeviceCard extending the Card class.

I was able to adjust my layout (header and the rest of the card's layout overlapping with each other, as shown in the screenshots) with just some minor and trivial changes in the cardslib_item_layout.xml file (which I had overlooked before); at the same time I was able to eliminate the phantom padding that is automatically attached to every card, by applying Mariotti's answer to question.

Answer 1

试试这个
您可以为 cards-lib 定义自己的布局。

创建您的自定义 XML:

这是一个例子custom_layout.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:orientation="horizontal"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:paddingLeft="8dp"
    android:paddingRight="6dp"
    android:paddingTop="7dp"
    android:paddingBottom="7dp"
    android:id="@+id/parentView">


    <TextView
        android:id="@+id/name"
        android:layout_height="wrap_content"
        android:layout_width="0dp"
        android:layout_weight="27"
        android:paddingRight="8dp"
        android:paddingLeft="8dp"
        android:textAppearance="@style/TextAppearance.AppCompat.Large"
        android:text=""
        android:layout_gravity="center"
        android:editable="false"
       />

</LinearLayout>

在您的 JAVA 代码中为您希望使用的自定义卡片创建 class：

    import it.gmariotti.cardslib.library.internal.Card;
    import it.gmariotti.cardslib.library.internal.ViewToClickToExpand;

public class DeviceCard extends Card {

        private String IP;
        private String MAC;
        private String name;
        private Boolean reachable;
        private Boolean editable;
        Boolean markedFlag;

        public DeviceCard(Context context) {
            this(context, R.layout.custom_layout);
        }

        public DeviceCard(Context context,String param1,...,Type paramn) {

            this(context, R.layout.device_card);
            this.name = param1;
        }



        public DeviceCard(Context context, int innerLayout) {
            super(context, innerLayout);
            init();
            Log.d("myTag", "Init called");
        }


        private void init(){


        }

        @Override
        public void setupInnerViewElements(ViewGroup parent, final View view)          {
            Log.i("myTag","setupInnerView");

            final TextView nameBox = (TextView)view.findViewById(R.id.name);
          //edit name if required

        }
    }

现在在您的 JAVA 代码中，当您需要使用卡片列表时：

DeviceCard card = new DeviceCard(this, name);

这个方法对我一直有效