Android RecycleView missing two textView out of 8 - android

I'm new to Android, and was following the tutorial on the following site:
http://www.androidauthority.com/how-to-build-an-image-gallery-app-718976/
Pretty much got everything to work, got lazy and used the image he provided, just used two of the images and copy to 8. However, can't figure out why two title of the image (img2 and img3) is missing.... they should be doing the same thing
My activity_main.xml
<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="com.example.peter.recycleviewtest.MainActivity">
<android.support.v7.widget.RecyclerView
android:id="#+id/imagegallery"
android:layout_width="match_parent"
android:layout_height="match_parent" />
</android.support.constraint.ConstraintLayout>
cell_layout.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:background="#FFFFFF"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<ImageView
android:layout_height="match_parent"
android:id="#+id/img"
android:adjustViewBounds="true"
android:layout_width="match_parent" />
<TextView
android:id="#+id/title"
android:layout_gravity="center"
android:textColor="#000"
android:textStyle="bold"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</LinearLayout>
main_activity
package com.example.peter.recycleviewtest;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.support.v7.widget.GridLayoutManager;
import android.support.v7.widget.RecyclerView;
import android.util.Log;
import java.util.ArrayList;
public class MainActivity extends AppCompatActivity {
private final String image_titles[] = {
"Img1A",
"Img2B",
"Img3C",
"Img4D",
"Img5E",
"Img6F",
"Img7G",
"Img8H",
};
private final Integer image_ids[] = {
R.drawable.img1,
R.drawable.img2,
R.drawable.img3,
R.drawable.img4,
R.drawable.img5,
R.drawable.img6,
R.drawable.img7,
R.drawable.img8,
};
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
RecyclerView recyclerView = (RecyclerView)findViewById(R.id.imagegallery);
recyclerView.setHasFixedSize(true);
RecyclerView.LayoutManager layoutManager = new GridLayoutManager(getApplicationContext(),2);
recyclerView.setLayoutManager(layoutManager);
ArrayList<CreateList> createLists = prepareData();
MyAdapter adapter = new MyAdapter(getApplicationContext(), createLists);
recyclerView.setAdapter(adapter);
}
private ArrayList<CreateList> prepareData(){
ArrayList<CreateList> theimage = new ArrayList<>();
for(int i = 0; i< image_titles.length; i++){
CreateList createList = new CreateList();
createList.setImage_title(image_titles[i]);
Log.d("DEBUG", "Title added: " + image_titles[i]);
createList.setImage_ID(image_ids[i]);
theimage.add(createList);
}
return theimage;
}
}
adaptor
public class MyAdapter extends RecyclerView.Adapter<MyAdapter.ViewHolder> {
private ArrayList<CreateList> galleryList;
private Context context;
public MyAdapter(Context context, ArrayList<CreateList> galleryList) {
this.galleryList = galleryList;
this.context = context;
}
#Override
public MyAdapter.ViewHolder onCreateViewHolder(ViewGroup viewGroup, int i) {
View view = LayoutInflater.from(viewGroup.getContext()).inflate(R.layout.cell_layout, viewGroup, false);
return new ViewHolder(view);
}
#Override
public void onBindViewHolder(MyAdapter.ViewHolder viewHolder, int i) {
Log.d("DEBUG", "onBindView added: " + galleryList.get(i).getImage_title());
viewHolder.title.setText(galleryList.get(i).getImage_title());
viewHolder.img.setScaleType(ImageView.ScaleType.CENTER_CROP);
viewHolder.img.setImageResource((galleryList.get(i).getImage_ID()));
}
#Override
public int getItemCount() {
return galleryList.size();
}
public class ViewHolder extends RecyclerView.ViewHolder{
private TextView title;
private ImageView img;
public ViewHolder(View view) {
super(view);
title = (TextView)view.findViewById(R.id.title);
img = (ImageView) view.findViewById(R.id.img);
}
}
}
Pretty much identical to the tutorial sample... but don't know why this missing title is happening. Thank you in advance.

I believe this is a combination of two things: the use of adjustViewBounds in your itemView layout and the internal behavior of RecyclerView.
Your itemView layout, stripped down, is:
<LinearLayout orientation=vertical>
<ImageView height=match_parent/>
<TextView>
</LinearLayout>
With this layout, I would expect to never see the image title. This is because you are giving the first child of the LinearLayout all of the available height. That leaves no room for the TextView.
However, since you also specified adjustViewBounds="true", you've given yourself a chance. If the image inside your ImageView isn't as tall as the parent, then it will shrink and now you'll have room for the TextView.
It looks like your two images have different dimensions, so sometimes this will happen. Sometimes it will not.
The best way to handle this is to re-write your itemView's layout. I suggest either using a LinearLayout and the layout_weight attribute, or using FrameLayout and overlaying the image title on top of the image.
LinearLayout solution
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#FFFFFF"
android:orientation="vertical">
<ImageView
android:id="#+id/img"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"/>
<TextView
android:id="#+id/title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:textColor="#000"
android:textStyle="bold"/>
</LinearLayout>
FrameLayout solution
<FrameLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#FFFFFF">
<ImageView
android:id="#+id/img"
android:layout_width="match_parent"
android:layout_height="match_parent"/>
<TextView
android:id="#+id/title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="bottom|center_horizontal"
android:textColor="#000"
android:textStyle="bold"/>
</FrameLayout>

Related

Add multiple expandable cardviews to layout

I am using AleSpero's library to create expandable cardviews for my layout. Works as expected, but now I want to add multiple cardviews in the same fragment layout, dynamically binding to some async list data that loads. How would that be possible?
Followed the demo on the library. Here is how I am adding the cards in the layout:
<LinearLayout
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/watchlist_holder"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingBottom="20dp"
android:orientation="vertical"
android:clipChildren="false"
android:background="#FAFAFA">
<com.alespero.expandablecardview.ExpandableCardView
android:id="#+id/main_profile_card"
android:layout_marginLeft="10dp"
android:layout_marginRight="10dp"
android:layout_marginTop="10dp"
android:layout_marginBottom="10dp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:title="My Watchlist"
app:inner_view="#layout/watchlist_layout"
app:expandOnClick="true" />
</LinearLayout>
#layout/watchlist_layout is a layout I want to repeat, it contain some textView and a recyclerView to show list data. Any help or guidance would be great.
You will need to create different Adapter and Inner Row XML Layout files for each RecyclerView.
For Ex: You inflate a layout in a RecyclerView inside the MainActivity. You are using an Adapter class which is inflating the rows based on your List. Inside onBindViewHolder, you should get the object of the inner RecyclerView which is present in the row layout of the parent view. Once you have the object, create another list and initialize another adapter for the inner recyclerview. Use the new adapter to populate data inside it (similar to the first recyclerview).
Keep in mind, the process remains same, with each recyclerview
Steps:
Create recylcerview inside the layout which is going to display the list
Create a separate row_layout to be inflated in each row based on the number of list data
Crete an Adapter class, which receives data from the parent class and inflates the layout (row_ayout) in the recyclerview
Repeat these steps for N number of Nested RecyclerViews
For the demo, I am attaching sample codes with this answer to help you understand my concept.
activity_main.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"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
tools:context=".MainActivity">
<androidx.recyclerview.widget.RecyclerView
android:id="#+id/recylcerViewParent"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
</LinearLayout>
item_layout_row.xml
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<com.alespero.expandablecardview.ExpandableCardView
android:id="#+id/main_profile_card"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp"
android:layout_marginTop="10dp"
android:layout_marginRight="10dp"
android:layout_marginBottom="10dp"
app:expandOnClick="true"
app:inner_view="#layout/watchlist_inner"
app:title="My Watchlist" />
</RelativeLayout>
item_recycler_view_favorite.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/layout_with_favorites"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<TextView
android:id="#+id/favorites_count"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginStart="#dimen/margin_small"
android:layout_marginLeft="#dimen/margin_small"
android:textSize="12sp" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginStart="#dimen/margin_small"
android:layout_marginEnd="#dimen/margin_small"
android:orientation="horizontal"
android:weightSum="2">
<Button
android:id="#+id/btn_view_details"
android:layout_width="0dp"
android:layout_height="30dp"
android:layout_weight="1"
android:background="#android:color/transparent"
android:gravity="start|center_vertical"
android:padding="5dp"
android:text="Atish"
android:textColor="#color/colorPrimaryDark" />
<Button
android:id="#+id/btn_add_symbols"
android:layout_width="0dp"
android:layout_height="30dp"
android:layout_weight="1"
android:background="#android:color/transparent"
android:gravity="end|center_vertical"
android:padding="5dp"
android:text="Agrawal"
android:textColor="#color/colorPrimaryDark" />
</LinearLayout>
</LinearLayout>
watchlist_inner.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/layout_with_favorites"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<TextView
android:id="#+id/favorites_count"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginStart="#dimen/margin_small"
android:layout_marginLeft="#dimen/margin_small"
android:textSize="12sp" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginStart="#dimen/margin_small"
android:layout_marginEnd="#dimen/margin_small"
android:orientation="horizontal"
android:weightSum="2">
<Button
android:id="#+id/btn_view_details"
android:layout_width="0dp"
android:layout_height="30dp"
android:layout_weight="1"
android:background="#android:color/transparent"
android:gravity="start|center_vertical"
android:padding="5dp"
android:text="VIEW DETAILS"
android:textColor="#color/colorPrimaryDark" />
<Button
android:id="#+id/btn_add_symbols"
android:layout_width="0dp"
android:layout_height="30dp"
android:layout_weight="1"
android:background="#android:color/transparent"
android:gravity="end|center_vertical"
android:padding="5dp"
android:text="ADD SYMBOLS"
android:textColor="#color/colorPrimaryDark" />
</LinearLayout>
<androidx.recyclerview.widget.RecyclerView
android:id="#+id/recycler_view_favorite"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginStart="#dimen/margin_small"
android:layout_marginEnd="#dimen/margin_small"
android:layout_marginBottom="#dimen/margin_small" />
</LinearLayout>
MainActivity.java
public class MainActivity extends AppCompatActivity {
List<String> stringsList = new ArrayList<>();
RecyclerView recyclerViewLayout;
InnerAdapter adapter;
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
recyclerViewLayout = findViewById(R.id.recylcerViewParent);
//Dummy add 10 objects in the list
for (int i = 0; i < 10; i++) {
stringsList.add(String.valueOf(i));
}
populateRecyclerView();
}
/**
* Create N items in the recycler view
*/
private void populateRecyclerView() {
//Initialize Adapter
recyclerViewLayout.setLayoutManager(new LinearLayoutManager(this));
recyclerViewLayout.setHasFixedSize(false);
adapter = new InnerAdapter(recyclerViewLayout, this);
adapter.setData(this.stringsList);
recyclerViewLayout.setAdapter(adapter);
}
}
InnerAdapter.java
public class InnerAdapter extends RecyclerView.Adapter<InnerAdapter.ViewHolder> {
private List<String> data;
private RecyclerView recyclerView;
private int i = 0;
private Context mContext;
public InnerAdapter(RecyclerView recyclerView, Context context) {
this.recyclerView = recyclerView;
this.mContext = context;
}
#NonNull
#Override
public ViewHolder onCreateViewHolder(#NonNull ViewGroup parent, int viewType) {
//Inflater creates rows from a given layout file
LayoutInflater inflater = LayoutInflater.from(parent.getContext());
View v = inflater.inflate(R.layout.item_layout_row, parent, false);
return new ViewHolder(v);
}
#Override
public void onBindViewHolder(#NonNull ViewHolder holder, int position) {
//Method to perform actions on individual row based on the position. We will get back to this later
//Change the title of the CardView
holder.main_profile_card.setTitle(String.valueOf(position));
//Creating a dummy adapter again to populate the inner recyclerview
List<String> innerData = new ArrayList<>();
for (int i = 0; i < 10; i++) {
innerData.add(String.valueOf(i));
}
//Initialize Inner Adapter
holder.recycler_view_favorite.setLayoutManager(new LinearLayoutManager(mContext));
holder.recycler_view_favorite.setHasFixedSize(false);
InnerFavAdapter adapter = new InnerFavAdapter(holder.recycler_view_favorite, mContext);
adapter.setData(innerData);
holder.recycler_view_favorite.setAdapter(adapter);
}
#Override
public int getItemCount() {
return data.size();
}
public void setData(List<String> data) {
this.data = data;
}
class ViewHolder extends RecyclerView.ViewHolder {
RecyclerView recycler_view_favorite;
ExpandableCardView main_profile_card;
ViewHolder(View itemView) {
super(itemView);
//Get the object of the views from the row layout
main_profile_card = itemView.findViewById(R.id.main_profile_card);
recycler_view_favorite = itemView.findViewById(R.id.recycler_view_favorite);
}
}
}
InnerFavAdapter.java
public class InnerFavAdapter extends RecyclerView.Adapter<InnerFavAdapter.ViewHolder> {
private List<String> data;
private RecyclerView recyclerView;
private int i = 0;
private Context mContext;
public InnerFavAdapter(RecyclerView recyclerView, Context context) {
this.recyclerView = recyclerView;
this.mContext = context;
}
#NonNull
#Override
public ViewHolder onCreateViewHolder(#NonNull ViewGroup parent, int viewType) {
//Inflater creates rows from a given layout file
LayoutInflater inflater = LayoutInflater.from(parent.getContext());
View v = inflater.inflate(R.layout.inner_recycler_view_favorite, parent, false);
return new ViewHolder(v);
}
#Override
public void onBindViewHolder(#NonNull ViewHolder holder, int position) {
//Method to perform actions on individual row based on the position. We will get back to this later
}
#Override
public int getItemCount() {
return data.size();
}
public void setData(List<String> data) {
this.data = data;
}
class ViewHolder extends RecyclerView.ViewHolder {
ViewHolder(View itemView) {
super(itemView);
}
}
}

Huge gap between cards of recyclerView

I have a recylerView to show the images fetched from firebase cloud, However there is a large gap between some items and these gaps arise after i start scrolling, before scrolling, everything is placed perfectly, I have read a few articles, however not proved to be correct in my case.
The code for my MainActivity is given below
RecyclerView.LayoutManager layoutManager = new StaggeredGridLayoutManager(2, StaggeredGridLayoutManager.VERTICAL);
recyclerView = (RecyclerView) findViewById(R.id.recyclerView);
recyclerView.setHasFixedSize(true);
recyclerView.setLayoutManager(layoutManager);
recyclerView.setItemAnimator(new DefaultItemAnimator());
Query query = firebaseDatabase.getReference().child("Products").child(Uid).orderByKey();
FirebaseRecyclerOptions options = new FirebaseRecyclerOptions.Builder<MainConstructor>().setQuery(query, MainConstructor.class).build();
mFirebaseAdapter = new FirebaseRecyclerAdapter<MainConstructor, ShowDataViewHolder>(options) {
#Override
public ShowDataViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
View view = LayoutInflater.from(parent.getContext()).inflate(R.layout.list_view, parent, false);
return new ShowDataViewHolder(view);
}
#Override
protected void onBindViewHolder(#NonNull ShowDataViewHolder holder, int position, #NonNull MainConstructor model) {
holder.setImg(getApplicationContext(),model.getImageUrl());
holder.setImageText(model.getImageUrl());
holder.setCode(model.getProductCode());
progressDialog.dismiss();
}
};
recyclerView.setAdapter(mFirebaseAdapter);
}
#Override
protected void onStart() {
super.onStart();
mFirebaseAdapter.startListening();
recyclerView.setAdapter(mFirebaseAdapter);
}
#Override
protected void onStop() {
super.onStop();
mFirebaseAdapter.stopListening();
}
The code for ViewHolder class is given as
public class ShowDataViewHolder extends RecyclerView.ViewHolder implements View.OnClickListener {
ImageView img;
TextView imageText, codeText;
public ShowDataViewHolder(final View itemView) {
super(itemView);
itemView.setOnClickListener(this);
}
private void setImg(Context ctx, String img1) {
img = (ImageView) itemView.findViewById(R.id.List_ImageView);
Picasso.with(ctx).load(img1).placeholder(R.drawable.notification).into(img);
// progressDialog.dismiss();
}
private void setImageText(String text){
imageText = (TextView)itemView.findViewById(R.id.textView);
imageText.setText(text);
}
private void setCode(String code){
codeText = (TextView)itemView.findViewById(R.id.Code);
codeText.setText(code);
}
The large unwanted gaps can be clearly seen here:
The list_view layout code is given as:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.v7.widget.CardView
android:layout_width="match_parent"
android:layout_height="150dp"
android:layout_margin="2dp">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<ImageView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/List_ImageView"
android:padding="2dp"/>
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/textView"
android:visibility="invisible"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/Code"
android:visibility="invisible"/>
</LinearLayout>
</android.support.v7.widget.CardView>
I have read someWhere that this problem arises because recyclerView continuously keeps on updating the items, so to correct that we need a ViewHolder class, however i have a viewHolder in my case then also this problem is there,
Can anyone help me with the solution and also with the exact problem why is it happening?
Thanks in advance
Your code is perfect just remove your parent node RelativeLayout which is actually not needed. That is creating issue with match_parent height.
<android.support.v7.widget.CardView
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="150dp"
android:layout_margin="2dp">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<ImageView
android:id="#+id/List_ImageView"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:padding="2dp" />
<TextView
android:id="#+id/textView"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:visibility="invisible" />
<TextView
android:id="#+id/Code"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:visibility="invisible" />
</LinearLayout>
</android.support.v7.widget.CardView>
Change this:
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
to this:
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content">

Incorrect layout alignment in list Item of RecyclerView

I'm having a problem with setting the layout in RecyclerView.
here is an layout xml code:
<?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="match_parent"
android:orientation="horizontal"
android:weightSum="1">
<TextView
android:id="#+id/dummy_text_view"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_weight="0.5"
android:background="#ffffff" />
<Button
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="0.3"
android:text="Button"
android:textAllCaps="false" />
</LinearLayout>
here is my MainActivity
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
RecyclerView recyclerView = (RecyclerView) findViewById(R.id.recycler_view);
LinearLayoutManager layoutManager = new LinearLayoutManager(MainActivity.this);
layoutManager.setOrientation(LinearLayoutManager.VERTICAL);
recyclerView.setLayoutManager(layoutManager);
List<String> list = new ArrayList<>();
for (int i = 0; i <= 25; i++) {
list.add("item " + i);
}
DummyRVAdapter adapter = new DummyRVAdapter(MainActivity.this, list);
recyclerView.setAdapter(adapter);
}
Code for Adapter :
public class DummyRVAdapter extends RecyclerView.Adapter<DummyRVAdapter.Holder> {
private Context mContext;
private List<String> mList;
public DummyRVAdapter(Context context, List<String> list) {
this.mContext = context;
this.mList = list;
}
#Override
public DummyRVAdapter.Holder onCreateViewHolder(ViewGroup parent, int viewType) {
View view = View.inflate(mContext, R.layout.item_dummy_layout, null);
//View view =LayoutInflater.from(mContext).inflate(R.layout.item_dummy_layout, null);
return new Holder(view);
}
#Override
public void onBindViewHolder(DummyRVAdapter.Holder holder, int position) {
holder.textView.setText(mList.get(position));
}
#Override
public int getItemCount() {
return mList.size();
}
public class Holder extends RecyclerView.ViewHolder {
TextView textView;
public Holder(View itemView) {
super(itemView);
textView = (TextView) itemView.findViewById(R.id.dummy_text_view);
}
}
}
Screenshot of my output.
In my layout XML file, I declare the size for textView as 50% and Button as 30%
,but still, my recyclerView not showing in a correct manner it is not showing in a correct manner.
This layout works fine in Listview.
I don't know where is the problem in my code. I set the Layout manager and adapter to my RecyclerView in the correct manner.
Edit:
Please see the ScreenShot it shows that TextView is not allocating 50% of the screen, that's the problem.
It I create complex Layout for Recyclerview its alignment is not in mentioned format.
but that works in Listview
Can anyone help me on this?
Thanks in advance.
Instead of
View view = View.inflate(mContext, R.layout.item_dummy_layout, null);
use:
View view = LayoutInflater.from(mContext).(R.layout.item_dummy_layout, parent, false);
Its not just weight that is having problem its the view textview may be occupying its size but it's text are samller than button size
one important thing Even after weight or without it use minsize and max size in button to fit it according to need like in your layout do this:
<?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="match_parent"
android:orientation="horizontal"
android:weightSum="1">
<TextView
android:id="#+id/dummy_text_view"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_weight="0.5"
android:background="#ffffff" />
<Button
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="0.3"
android:text="Button"
android:max_height="30dp"
android:textAllCaps="false" />
As android:weightSum="1" but sum of all android:layout_weight was not equal to 1 so this was not showing properly
you have declare the size for textView as 50% and Button as 30% but rest remaining is 20% due to this reason it is not showing in proper way. so can do as either increase textview to 70% and Button to 30% so android:weightSum and android:layout_weight sum will be equal.
Change your layout to
<?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="match_parent"
android:orientation="horizontal"
android:weightSum="1" >
<TextView
android:id="#+id/dummy_text_view"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="0.7"
android:background="#ffffff" />
<Button
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="0.3"
android:text="Button"
android:textAllCaps="false" />
</LinearLayout >

how to make an expandable list of cardviews?

I searched a lot to find a direct and clear solution for I think a popular problem but unfortunately I couldn't find it.
We want to have a list of cardviews so each card bind to a specific data and each card has a list inside that shows meta or detail data about its parent.
So we have a nested list inside a cardview.
With a simple search, we know that we should use expanded list view which parents items are cardviews and we must have another layout for its child.
So when you click on cards a list of items appears below of your cards on the root.
But we want to show child list inside of cards?
And there is no access to the something like child list id or any other things to refer to a transition animation and change of layout.
So the clear question is how to add a listview inside a cardview?
i follow my work by using tablelayout and table row. and prefer not to use external libraries for stability and version problems.
this is what i mean.
Image that describe my question
If you don't want to use an external library, you can make your CardView expand like this:
Layout file for an expandable CardView
<?xml version="1.0" encoding="utf-8"?>
<android.support.v7.widget.CardView
xmlns:card_view="http://schemas.android.com/apk/res-auto"
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/cv"
android:layout_marginTop="5dp"
android:layout_marginLeft="5dp"
android:layout_marginRight="5dp"
card_view:cardCornerRadius="5dp">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="10dp"
android:orientation="vertical">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="48dp"
>
<TextView
android:id="#+id/textView_name"
android:layout_marginTop="10dp"
android:layout_marginBottom="10dp"
android:textSize="18sp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textStyle="bold" />
<!--My dropdown Button -->
<RelativeLayout
android:id="#+id/button"
android:layout_width="48dp"
android:layout_height="48dp"
android:layout_gravity="end"
android:layout_alignParentRight="true"
android:gravity="center"
>
<View
android:layout_width="12dp"
android:layout_height="12dp"
android:background="#drawable/triangle"
android:layout_alignParentRight="false"
android:layout_alignParentEnd="false" />
</RelativeLayout>
</RelativeLayout>
<!--The layout below is my ExpandableLayout -->
<LinearLayout
android:id="#+id/expandableLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
>
<android.support.v7.widget.AppCompatImageView
android:id="#+id/imageView_Owner"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="5dp"
android:orientation="vertical">
<TextView
android:id="#+id/textView_Owner"
android:textSize="16sp"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
<TextView
android:id="#+id/textView_OwnerUrl"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</LinearLayout>
</LinearLayout>
</LinearLayout>
</android.support.v7.widget.CardView>
My ExpandableRecyclerAdapter Class
import android.animation.ObjectAnimator;
import android.content.Context;
import android.support.v7.widget.RecyclerView;
import android.util.SparseBooleanArray;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.view.animation.LinearInterpolator;
import android.widget.ImageView;
import android.widget.LinearLayout;
import android.widget.RelativeLayout;
import android.widget.TextView;
import com.squareup.picasso.Picasso;
import java.util.List;
public class ExpandableRecyclerAdapter extends RecyclerView.Adapter<ExpandableRecyclerAdapter.ViewHolder> {
private List<Repo> repos;
private SparseBooleanArray expandState = new SparseBooleanArray();
private Context context;
public ExpandableRecyclerAdapter(List<Repo> repos) {
this.repos = repos;
//set initial expanded state to false
for (int i = 0; i < repos.size(); i++) {
expandState.append(i, false);
}
}
#Override
public ExpandableRecyclerAdapter.ViewHolder onCreateViewHolder(ViewGroup viewGroup, int i) {
this.context = viewGroup.getContext();
View view = LayoutInflater.from(viewGroup.getContext()).inflate(R.layout.expandable_card_row, viewGroup, false);
return new ViewHolder(view);
}
#Override
public void onBindViewHolder(final ExpandableRecyclerAdapter.ViewHolder viewHolder, final int i) {
viewHolder.setIsRecyclable(false);
viewHolder.tvName.setText(repos.get(i).getName());
viewHolder.tvOwnerLogin.setText("Owner: " +repos.get(i).getOwner().getLogin());
viewHolder.tvOwnerUrl.setText(repos.get(i).getOwner().getUrl());
Picasso.with(context)
.load(repos.get(i).getOwner().getImageUrl())
.resize(500, 500)
.centerCrop()
.into(viewHolder.ivOwner);
//check if view is expanded
final boolean isExpanded = expandState.get(i);
viewHolder.expandableLayout.setVisibility(isExpanded?View.VISIBLE:View.GONE);
viewHolder.buttonLayout.setRotation(expandState.get(i) ? 180f : 0f);
viewHolder.buttonLayout.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(final View v) {
onClickButton(viewHolder.expandableLayout, viewHolder.buttonLayout, i);
}
});
}
#Override
public int getItemCount() {
return repos.size();
}
public class ViewHolder extends RecyclerView.ViewHolder{
private TextView tvName,tvOwnerLogin, tvOwnerUrl;
private ImageView ivOwner;
public RelativeLayout buttonLayout;
public LinearLayout expandableLayout;
public ViewHolder(View view) {
super(view);
tvName = (TextView)view.findViewById(R.id.textView_name);
tvId = (TextView)view.findViewById(R.id.textView_id);
tvUrl = (TextView)view.findViewById(R.id.textView_url);
tvOwnerLogin = (TextView)view.findViewById(R.id.textView_Owner);
tvOwnerUrl = (TextView)view.findViewById(R.id.textView_OwnerUrl);
ivOwner = (ImageView) view.findViewById(R.id.imageView_Owner);
buttonLayout = (RelativeLayout) view.findViewById(R.id.button);
expandableLayout = (LinearLayout) view.findViewById(R.id.expandableLayout);
}
}
private void onClickButton(final LinearLayout expandableLayout, final RelativeLayout buttonLayout, final int i) {
//Simply set View to Gone if not expanded
//Not necessary but I put simple rotation on button layout
if (expandableLayout.getVisibility() == View.VISIBLE){
createRotateAnimator(buttonLayout, 180f, 0f).start();
expandableLayout.setVisibility(View.GONE);
expandState.put(i, false);
}else{
createRotateAnimator(buttonLayout, 0f, 180f).start();
expandableLayout.setVisibility(View.VISIBLE);
expandState.put(i, true);
}
}
//Code to rotate button
private ObjectAnimator createRotateAnimator(final View target, final float from, final float to) {
ObjectAnimator animator = ObjectAnimator.ofFloat(target, "rotation", from, to);
animator.setDuration(300);
animator.setInterpolator(new LinearInterpolator());
return animator;
}
}
In your Activity/Fragment, set up RecyclerView like this
private RecyclerView recyclerView;
private List<Repo> data;
recyclerView = (RecyclerView)findViewById(R.id.card_recycler_view);
recyclerView.setHasFixedSize(true);
RecyclerView.LayoutManager layoutManager = new LinearLayoutManager(getApplicationContext());
recyclerView.setLayoutManager(layoutManager);
//fetch data and on ExpandableRecyclerAdapter
recyclerView.setAdapter(new ExpandableRecyclerAdapter(data));
So, its quite simple to create an expandable CardView without external Library. The code is almost exactly the same as using a normal CardView with RecyclerView, the main change is setting the View.GONE/View.VISIBLE on button click.
You can use ExpandLayout,and then add it in cardview.
<com.kyo.expandablelayout.ExpandableLayout
android:id="#+id/expandlayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:padding="12dp" >
<ImageView
android:id="#+id/imageview"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:contentDescription="#null"
android:scaleType="centerCrop"
android:src="#drawable/parent" />
<ImageView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="6dp"
android:contentDescription="#null"
android:scaleType="centerCrop"
android:src="#drawable/child"
app:canExpand="true" />
</com.kyo.expandable.ExpandableLayout>

CardView not showing content eclipse

I am using android.support.v7.widget.CardView to show ImageView with two TextView's in RecyclerView but card view not showing the content(showing only blank white cards) when the screen orientation is vertical, on the other hand it is showing content when orientation is landscape.
When I run the same project from AndroidStudio there is no problem everything works fine.
I don't understand what is problem out there, is there problem with eclipse?
Please see the code below,
PostListFragment
public class PostListFragment extends Fragment implements AppConfig {
private ArrayList<Post> mPostArrayList;
private PostRecyclerAdapter mPostRecyclerAdapter;
private RecyclerView mRecyclerView;
//other declarations
#Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
Bundle savedInstanceState) {
//removed
}
private void init() {
// Set up RecyclerView
mRecyclerView = (RecyclerView) mRootView
.findViewById(R.id.mPostListRecyclerView);
// Setup layout manager for mPostArrayList and column count
final LinearLayoutManager mLayoutManager = new LinearLayoutManager(
getActivity());
// Control orientation of the mPostArrayList
mLayoutManager.setOrientation(LinearLayoutManager.VERTICAL);
mLayoutManager.scrollToPosition(0);
// Attach layout manager
mRecyclerView.setLayoutManager(mLayoutManager);
// Listen to the item touching
mRecyclerView.addOnItemTouchListener(new RecyclerItemClickListener(
getActivity(),
new RecyclerItemClickListener.OnItemClickListener() {
#Override
public void onItemClick(View itemView, int position) {
//some action
}
}));
mPostArrayList = new ArrayList<>();
// Bind adapter to recycler
mPostRecyclerAdapter = new PostRecyclerAdapter(
getActivity(), mPostArrayList);
mRecyclerView.setAdapter(mPostRecyclerAdapter);
}
private void getPosts() {
// Execute async task
new AsyncPosts().execute(mPostURL);
}
public class AsyncPosts extends AsyncTask<Object, String, JSONObject> {
//no problem with this
}
}
Layout used for PostListFragment
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:ads="http://schemas.android.com/apk/res-auto"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/mParentLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<FrameLayout
android:id="#+id/mPostListContainer"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1" >
<android.support.v4.widget.SwipeRefreshLayout
android:id="#+id/mPostListSwipeRefreshLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content" >
<android.support.v7.widget.RecyclerView
android:id="#+id/mPostListRecyclerView"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
</android.support.v4.widget.SwipeRefreshLayout>
</FrameLayout>
<!-- removed -->
</LinearLayout>
Here is adapter to set the values,
PostRecyclerAdapter
public class PostRecyclerAdapter extends
RecyclerView.Adapter<PostRecyclerAdapter.SimpleItemViewHolder> {
private Context mContext;
private List<Post> post;
// Provide a suitable constructor (depends on the kind of data store)
public PostRecyclerAdapter(Context context, List<Post> items) {
this.mContext = context;
this.post = items;
}
// Return the size of your data set (invoked by the layout manager)
#Override
public int getItemCount() {
return this.post.size();
}
// Create new items (invoked by the layout manager)
// Usually involves inflating a layout from XML and returning the holder
#Override
public SimpleItemViewHolder onCreateViewHolder(ViewGroup viewGroup,
int viewType) {
View itemView = LayoutInflater.from(viewGroup.getContext()).inflate(
R.layout.post_list_item, viewGroup, false);
return new SimpleItemViewHolder(itemView);
}
// Replace the contents of a view (invoked by the layout manager)
// Involves populating data into the item through holder
#Override
public void onBindViewHolder(SimpleItemViewHolder viewHolder, int position) {
Glide.with(mContext).load(post.get(position).IMG_URL)
.placeholder(R.drawable.ic_placeholder).crossFade(1000)
.centerCrop().into(viewHolder.mPostListSmallThumbnail);
viewHolder.mPostListSmallTitle.setText(post.get(position).POST_TITLE);
viewHolder.mPostListSmallContent
.setText(post.get(position).POST_CONTENT);
}
// Provide a reference to the views for each data item
// Provide access to all the views for a data item in a view holder
public final static class SimpleItemViewHolder extends
RecyclerView.ViewHolder {
ImageView mPostListSmallThumbnail;
TextView mPostListSmallTitle, mPostListSmallContent;
public SimpleItemViewHolder(View itemView) {
super(itemView);
mPostListSmallThumbnail = (ImageView) itemView
.findViewById(R.id.mPostListSmallThumbnail);
mPostListSmallTitle = (TextView) itemView
.findViewById(R.id.mPostListSmallTitle);
mPostListSmallContent = (TextView) itemView
.findViewById(R.id.mPostListSmallContent);
}
}
}
post_list_item
<?xml version="1.0" encoding="utf-8"?>
<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/mPostListSmallCard"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:foreground="#drawable/card_background"
android:clickable="true"
app:cardCornerRadius="#dimen/blog_card_radius"
app:cardUseCompatPadding="true"
app:contentPadding="#dimen/blog_card_radius">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageView
android:id="#+id/mPostListSmallThumbnail"
android:layout_width="#dimen/blog_image_thumb_dim"
android:layout_height="#dimen/blog_image_thumb_dim"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:layout_alignParentTop="true"
android:background="#drawable/ic_placeholder"
android:adjustViewBounds="true"
android:contentDescription="#string/image_thumbnail_placeholder" />
<TextView
android:id="#+id/mPostListSmallTitle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentEnd="true"
android:layout_alignParentRight="true"
android:layout_alignParentTop="true"
android:layout_marginLeft="#dimen/post_list_margin_left"
android:layout_marginStart="#dimen/post_list_margin_right"
android:layout_toEndOf="#+id/mPostListSmallThumbnail"
android:layout_toRightOf="#+id/mPostListSmallThumbnail"
android:ellipsize="end"
android:lines="2"
android:singleLine="false"
android:textAppearance="?android:attr/textAppearanceMedium" />
<TextView
android:id="#+id/mPostListSmallContent"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignBottom="#+id/mPostListSmallThumbnail"
android:layout_alignEnd="#+id/mPostListSmallTitle"
android:layout_alignLeft="#+id/mPostListSmallTitle"
android:layout_alignRight="#+id/mPostListSmallTitle"
android:layout_alignStart="#+id/mPostListSmallTitle"
android:layout_below="#+id/mPostListSmallTitle"
android:ellipsize="end"
android:lines="3"
android:textAppearance="?android:attr/textAppearanceSmall" />
</RelativeLayout>
</android.support.v7.widget.CardView>
Here is post_list_item for landscape layout
land/post_list_item
<?xml version="1.0" encoding="utf-8"?>
<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/mPostListSmallCard"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginRight="#dimen/blog_card_margin_landscape"
android:layout_marginLeft="#dimen/blog_card_margin_landscape"
app:cardCornerRadius="#dimen/blog_card_radius"
app:cardUseCompatPadding="true">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageView
android:id="#+id/mPostListSmallThumbnail"
android:layout_width="#dimen/blog_image_thumb_dim"
android:layout_height="#dimen/blog_image_thumb_dim"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:layout_alignParentTop="true"
android:adjustViewBounds="true"
android:contentDescription="#string/image_thumbnail_placeholder" />
<TextView
android:id="#+id/mPostListSmallTitle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentEnd="true"
android:layout_alignParentRight="true"
android:layout_alignParentTop="true"
android:layout_marginLeft="#dimen/post_list_margin_left"
android:layout_marginStart="#dimen/post_list_margin_right"
android:layout_toEndOf="#+id/mPostListSmallThumbnail"
android:layout_toRightOf="#+id/mPostListSmallThumbnail"
android:ellipsize="end"
android:lines="2"
android:singleLine="false"
android:textAppearance="?android:attr/textAppearanceMedium" />
<TextView
android:id="#+id/mPostListSmallContent"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignBottom="#+id/mPostListSmallThumbnail"
android:layout_alignEnd="#+id/mPostListSmallTitle"
android:layout_alignLeft="#+id/mPostListSmallTitle"
android:layout_alignRight="#+id/mPostListSmallTitle"
android:layout_alignStart="#+id/mPostListSmallTitle"
android:layout_below="#+id/mPostListSmallTitle"
android:ellipsize="end"
android:lines="3"
android:textAppearance="?android:attr/textAppearanceSmall" />
</RelativeLayout>
</android.support.v7.widget.CardView>

Categories

Resources