Search code examples
javaandroidcustom-adapter

How to align ImageView and TextView in Custom ListView


I have created a Custom Adapter to show ImageView and TextView together in ListView. But the ImageView is showing on the top of TextView in every row of Listview. I have attached a screenshot of app below:

App Screenshot

Custom Adapter Class:

public class CustomeAdapter extends BaseAdapter {
    private Context context;
    private ListView listView;
    private ArrayList<PlayersModel> playersModelArrayList;

    public CustomeAdapter(Context context, ArrayList<PlayersModel> playersModelArrayList) {

        this.context = context;
        this.playersModelArrayList = playersModelArrayList;
    }

    @Override
    public int getViewTypeCount() {
        return getCount();
    }
    @Override
    public int getItemViewType(int position) {

        return position;
    }

    @Override
    public int getCount() {
        return playersModelArrayList.size();
    }

    @Override
    public Object getItem(int position) {
        return playersModelArrayList.get(position);
    }

    @Override
    public long getItemId(int position) {
        return 0;
    }

    @Override
    public View getView(int position,View convertView,ViewGroup parent) {
        ViewHolder holder;


        if (convertView == null) {
            holder = new ViewHolder();
            LayoutInflater inflater = (LayoutInflater) context
                    .getSystemService(Context.LAYOUT_INFLATER_SERVICE);
            convertView = inflater.inflate(R.layout.lv_item, null, true);

            holder.icon = (TextView) convertView.findViewById(R.id.TextID);
            holder.tvname = (TextView) convertView.findViewById(R.id.name);
            holder.tvdescr = (TextView) convertView.findViewById(R.id.descr);
            holder.tvlink = (TextView) convertView.findViewById(R.id.link);
            holder.ImageIcon = (ImageView) convertView.findViewById(R.id.logoImageView);

            convertView.setTag(holder);
        }else {
            holder = (ViewHolder)convertView.getTag();


        }

        holder.ImageIcon.setImageResource(playersModelArrayList.get(position).getImageId());
        holder.icon.setText(playersModelArrayList.get(position).getICON());
        holder.tvname.setText(playersModelArrayList.get(position).getName());
        holder.tvdescr.setText(playersModelArrayList.get(position).getDescr());
        holder.tvlink.setText(playersModelArrayList.get(position).getLink());


            Glide.with(context)
                    .load("http://csalabs.in/wp-content/uploads/2017/10/CSA-Final-PNG-300x350.png")
                    .override(200,200)
                    .into(holder.ImageIcon);
            Log.d("Icon URL",holder.icon.toString());

        return convertView;
    }
    private class ViewHolder {

        protected TextView icon, tvname, tvdescr, tvlink;
        protected ImageView ImageIcon;
    }
}

Layout File

<?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:padding="10dp"
    android:orientation="vertical">

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="vertical"
        android:onClick="buttonClickNew">

        <ImageView
            android:id="@+id/logoImageView"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:scaleType="fitStart"
            android:adjustViewBounds="true"
            tools:srcCompat="@tools:sample/avatars[0]" />

        <TextView
            android:id="@+id/name"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:textColor="#383838"
            android:layout_marginTop="10dp"
            android:textSize="15sp"
            android:textStyle="bold"
            android:gravity="center_vertical"

            android:textAppearance="?android:attr/textAppearanceMedium"
            android:paddingLeft="10dp"
            android:text="Name" />
        <TextView
            android:id="@+id/descr"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:textColor="#313131"
            android:textSize="12sp"
            android:gravity="center_vertical"
            android:textAppearance="?android:attr/textAppearanceMedium"
            android:paddingLeft="10dp"
            android:text="Country" />
        <TextView
            android:id="@+id/link"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:textColor="#383838"
            android:gravity="center_vertical"
            android:textAppearance="?android:attr/textAppearanceMedium"
            android:paddingLeft="10dp"
            android:text="@string/city"
            android:visibility="gone"/>
        <TextView
            android:id="@+id/TextID"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:textColor="#313131"
            android:textSize="12sp"
            android:gravity="center_vertical"
            android:textAppearance="?android:attr/textAppearanceMedium"
            android:paddingLeft="10dp"/>


    </LinearLayout>
    <View
        android:layout_width="match_parent"
        android:layout_height="1dp"
        android:layout_marginTop="10dp"
        android:layout_marginLeft="10dp"
        android:layout_marginRight="10dp"
        android:background="@color/colorAccent"/>

</LinearLayout>

How to align ImageView on the left side of TextView? Thanks in advance. BTW I am newbie in android and java.


Solution

  • Try this

    <?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="wrap_content"
        android:orientation="vertical"
        android:padding="10dp">
    
        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content">
    
            <ImageView
                android:id="@+id/logoImageView"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:adjustViewBounds="true"
                android:scaleType="fitStart"
                tools:srcCompat="@tools:sample/avatars[0]" />
    
            <LinearLayout
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:onClick="buttonClickNew"
                android:orientation="vertical">
    
    
                <TextView
                    android:id="@+id/name"
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:layout_marginTop="10dp"
                    android:gravity="center_vertical"
                    android:paddingLeft="10dp"
                    android:text="Name"
                    android:textAppearance="?android:attr/textAppearanceMedium"
                    android:textColor="#383838"
                    android:textSize="15sp"
                    android:textStyle="bold" />
    
                <TextView
                    android:id="@+id/descr"
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:gravity="center_vertical"
                    android:paddingLeft="10dp"
                    android:text="Country"
                    android:textAppearance="?android:attr/textAppearanceMedium"
                    android:textColor="#313131"
                    android:textSize="12sp" />
    
                <TextView
                    android:id="@+id/link"
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:gravity="center_vertical"
                    android:paddingLeft="10dp"
                    android:text="city"
                    android:textAppearance="?android:attr/textAppearanceMedium"
                    android:textColor="#383838"
                    android:visibility="visible" />
    
                <TextView
                    android:id="@+id/TextID"
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:gravity="center_vertical"
                    android:paddingLeft="10dp"
                    android:textAppearance="?android:attr/textAppearanceMedium"
                    android:textColor="#313131"
                    android:textSize="12sp" />
    
    
            </LinearLayout>
    
        </LinearLayout>
    
        <View
            android:layout_width="match_parent"
            android:layout_height="1dp"
            android:layout_marginLeft="10dp"
            android:layout_marginTop="10dp"
            android:layout_marginRight="10dp"
            android:background="@color/colorAccent" />
    
    </LinearLayout>