What is the exact way to set up cards using cardlib?

I have a card declared in a file 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">

      

and set as content in a onCreate()

method:

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();
            }
        });
}

      

Now I would like to customize it with my own layout, containing a narrow header and some information, like this:

<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> 

      

What is the canonical procedure for such a process? I tried many settings, i.e .:

  • creating a second xml file named cardslib_item_layout.xml

    and linking to it with a constructor Card

    like this: Card card = new Card(this, R.layout.cardslib_item_layout);

    and then installingsetContentView(R.layout.cardslib_item_card_view)

  • Adding a layout inside the map and installing setContentView(R.layout.cardslib_item_card_view)

    .

Thus; 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>

      

Both tests have the following problems:

  • The overall result is completely skewed.
  • Most importantly, the RelativeLayout is placed at the top of the map, making any operation on the map impossible (for example, setting Card.OnCardClickListener

    on the map itself will not work as the user will click the RelativeLayout and not the map itself)

try 1: enter image description here try 2: enter image description here

What is Canonical Procedure?

EDIT2: ANSWER

The input provided by @Msk did a great job for me, although I later found that with some minor changes it is also possible to get the same results using the original cardlib class Card

without having to go through the creation of a new class DeviceCard

extending the class Card

.

I was able to tweak my layout (header and rest of the map overlapping each other as shown in the screenshots) with some minor and trivial changes to the file cardslib_item_layout.xml

(which I hadn't noticed before); in the meantime, I was able to eliminate the phantom padding that is automatically attached to every card by applying Mariotti's answer to this question.

+3


source to share


1 answer


Try this You can define your own layout for the maps-lib.

Create your own XML:

Here is an example 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>

      

In JAVA code, create a class for the custom map you want to use:



    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

        }
    }

      

Now in your JAVA code when you need to use a list of maps:

DeviceCard card = new DeviceCard(this, name);

      

This method has always worked for me

+2


source







All Articles