ImageView and Listview - Android - android

Good Day!!!
I have a problem with the layout specially in the landscape orientation in android.
When I am going to change the orientation to landscape, it seems that the ImageView is in a fixed position and I can only see scrollbar in the listview...I just want to have a layout that also the imageview can be scrolled so that I can see clearly the list items.
Here's my layout xml
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent" >
<ImageView
android:id="#+id/imageView1"
android:layout_width="fill_parent"
android:adjustViewBounds="true"
android:scaleType="fitXY"
android:layout_height="wrap_content"
android:contentDescription="#string/app_name"
android:src="#drawable/banner" />
<ListView
android:id="#android:id/list"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_below="#+id/imageView1"
android:drawSelectorOnTop="true" />
</RelativeLayout>

This is a bit tricky because you can't put a listview inside a scrollview but you can make it work if you create a custom adapter which can have different types of rows (e.g. A row with text only, a row with an ImageView, etc.).
Then have your first row in that ListView always be an image.
Check out this tutorial (Section: Different list items’ layouts) to learn how to make different types of rows.

I think using ListView in ScrollView is not a good thing If u want that image should also scroll than do like this:
1) For Listview you need a custome adapter in which in custom adapter class's getview() method u have to something like this
public View getView(int position, View convertView, ViewGroup parent)
{
LayoutInflater inflater = getLayoutInflater();
View row;
row = inflater.inflate(R.layout.listview_rowlayout, parent, false);
TextView textview = (TextView) row.findViewById(R.id.tv_list);
ImageView imageview = (ImageView) row.findViewById(R.id.iv_list);
textview.setText(data_text[position]);
if(position==0){
imageview.setImageResource(R.drawable.YourimageName);
}else{
imageview.setVisibility(View.GONE);
}
return (row);
}
where your listview_rowlayout.xml is something like this
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/relativeLayout1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center_vertical" >
<ImageView
android:id="#+id/iv_list"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParenttop="true"
android:layout_marginLeft="10dp"
/>
<TextView
android:id="#+id/tv_list"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:textColor="#000000"
android:layout_alignBottom="#+id/imageView1"
android:text="" />
</RelativeLayout>
and your main.xml in which u have added listview should be something like this
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent" >
<ListView
android:id="#android:id/list"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:drawSelectorOnTop="true" />
</RelativeLayout>

Related

How to design a list view showing name and online status in a single row

I am creating an online chat app.In that I am using a list view to show the contacts who are online at that time. My problem is that i want to show the contact name and green color status icon or something like (as like in facebook or any other chat application) in a single row.
I don't know how to display contact name + a green color on the right end of the listview
can anybody help me solve the problem
What you need is a class that extends from BaseAdapter. There you can define your own Layout for each listItem.
So first you have to define a layout that contains a TextView for the contactname and e.g. a ImageView.
This Layout should be customized in the getView() method of your BaseAdapter.
But please read this article to ensure a "smooth scrolling" of you listView
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center_vertical"
>
<TextView
android:text="Contact name"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
/>
<View
android:layout_width="10dip"
android:layout_height="match_parent"
android:background="#color/green"
/>
</LinearLayout>
try this,
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:gravity="center_vertical" >
<TextView
android:id="#+id/friendname"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="2.5"
android:gravity="center_vertical"
android:paddingLeft="10dip"
android:singleLine="true"
android:text="usename" />
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="0.2"
android:background="#drawable/profile"
android:paddingLeft="10dip"
/>
</LinearLayout>
You need to create custom adapter for listview and set it to this listview.
This tutorial
Will show you how to do it.
Good luck
For that you have to make custom layout for your ListView item like below :
<?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="wrap_content"
>
<TextView
android:text="Contact name"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
/>
<ImageView
android:layout_width="10dip"
android:layout_height="match_parent"
android:background="green_circle_image"
android:layout_alignParentRight="true"
/>
</RelativeLayout>
Look this is a very simple case where you want a custom item inside a listview , rather then giving you code I would suggest you to understand the concept of layout inflation where you can inflate almost all the container layouts with your designed layouts.
Google it you will yourself find a lot of examples in your case it seems a textview and imageview only.
You can use the following layout for your custom adapter:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<TextView
android:id="#+id/statusTextView"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:drawableRight="#drawable/status" />
</LinearLayout>
To change the dinamically the image you can use setCompoundDrawablesWithIntrinsicBounds (int left, int top, int right, int bottom) inside getView(...), from your custom adapter.
Ex:
public View getView(int position, View convertView, ViewGroup parent) {
convertView = context.getLayoutInflater().inflate(R.layout.item_element, null);
TextView statusTV = (TextView) convertView.findViewById(R.id.status);
statusTV.setText("...");
Drawable compoundDrawable = context.getResources().getDrawable(R.drawable.status);
statusTV.setCompoundDrawables(compoundDrawable, null, null, null);
return convertView;
}
And use a viewHolder pattern for listView optimization.

add listView and imageView at its end

I want to create the layout to be like what in the diagram
how can I make the listView Scroll independently and make the textView and ImageView stead?
just replace your xml layout like below 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:background="#android:color/white"
android:padding="5dp"
android:weightSum="2"
android:orientation="vertical" >
<LinearLayout android:layout_width="fill_parent" android:layout_height="0dp" android:layout_weight="1" android:orientation="vertical">
<TextView
android:id="#+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Small Text"
android:layout_gravity="right"
android:textColor="#android:color/black"
android:textAppearance="?android:attr/textAppearanceSmall" />
<ListView
android:id="#+id/listView1"
android:layout_width="match_parent"
android:layout_height="match_parent">
</ListView>
</LinearLayout>
<ImageView
android:id="#+id/imageView1"
android:layout_width="fill_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:src="#drawable/yourimg" />
</LinearLayout>
above xml given output below screenshot:
For the Lower Steady Image View you can use : Create a footer view
layout consisting of text that you want to set as footer and then try
View footerView = ((LayoutInflater) ActivityContext.getSystemService(Context.LAYOUT_INFLATER_SERVICE)).inflate(R.layout.footer_layout, null, false);
ListView.addFooterView(footerView);
For Header: The solution that works for me is to create a TableLayout
that has a row with the heading and a row with the list like this:
<TableLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<include layout="#layout/header" />
<ListView
android:id="#android:id/list"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
/>
</TableLayout>
Please make sure that the ListView has #android:id/list as the ID.
OR
Rather google adding header and footer to listview in android that
will help u much better
Sorry for the pseudo code, I can try a better attempt later on, but you need:
RelativeLayout
TextView - align top
ImageView - align bottom
ScrollView - align above ImageView, align below TextView
Create a linear layout with orientation as vertical. Add textview listview and imageview with the weight as you want. Remember to give layout_height as 0dp for all the three components.
Add Header And Footer To the Listview,Like
ListView mList=getListView();
mList.addHeaderView(View v);//Your textView
and
mList.addFooterView(v);//your imageview

Single row to fill_parent ListView height

There's one row in the listView which I want to be with the same height as the listView (let's say that is full-screen).
The row layout looks like
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical" >
<ImageView
android:id="#+id/imageView"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:src="#drawable/error" />
<TextView
android:id="#+id/textView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/imageView"
android:layout_centerHorizontal="true"
android:layout_marginTop="14dp"
android:minHeight="30dip"
android:textAppearance="?android:attr/textAppearanceMedium"/>
</RelativeLayout>
And the adapter's getView is
#Override
public View getView(int position, View convertView, ViewGroup parent) {
View row = inflater.inflate(R.layout.myrow, parent, false);
return row;
}
Bu the row is displayed the same as it would be with android:layout_height="wrap_content".
Layout preview shows the row filling it's parent and I'm using inflate(R.layout.myrow, parent, false);, the listView is certainly displayed full-screen and the row is only as tall as the image + textView.
Am i missing something important ?
I had similar problem I think I have solved so reporting here.
I have more rows in my ListView, but I want that the row height be the same of the listview, which in turn shall occupy all the remaining space of the layout. My row is made of just one ImageView. I had problems with the following:
-I want that smaller images expand to occupy all the space
-Bigger images shall not exapnd more than a row height
If I have made any error please leave a note here.
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="0.9"
android:gravity="center"
android:orientation="vertical">
<ListView
android:id="#id/lay_main_firma_objekti"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center">
</ListView>
</LinearLayout>
Row layout:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center">
<TextView
android:id="#+id/xx"
android:layout_width="match_parent"
android:layout_height="match_parent"/>
<ImageView
android:id="#id/imageView_obj"
android:contentDescription="#string/objektDesc"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_alignLeft="#id/xx"
android:layout_alignTop="#id/xx"
android:layout_alignRight="#id/xx"
android:layout_alignBottom="#id/xx"
android:scaleType="fitXY"
android:src="#drawable/custom_prazno" />
</RelativeLayout>
Then in the Adapter getView it is important to
convertView.setMinimumHeight(parent.getMeasuredHeight());
ImageView slika=(ImageView)v.findViewById(R.id.imageView_obj);
slika.setMinimumHeight(parent.getMeasuredHeight());
TextView xx=(TextView)v.findViewById(R.id.xx);
xx.setHeight(parent.getMeasuredHeight());
I think that is.
hth
just wondering if there's a particular reason why you want to have a ListView containing only one row? As opposed to just using the RelativeLayout directly instead of ListView?
I've ended up with hardcoding the row height. There is a problem with relative layout after setting it's minimumHeight so I've also replaced it with the LinearLayout with centered gravity.
Please let me know if there's a better solution letting Android to do it's job and minimizing hardcode.

Prevent ListView from scrolling

I have a scrollview with a linear layout in it. Within that linear layout there is a list view. The problem I am having is that my list view only has a certain amount of space and then becomes scrollable. I don't want this to happen. I want the entire list to be shown. Does anyone know how I might achieve this? I have tried using this link however my layout does not appear when I add the footer. ListView in ScrollView potential workaround This is my code:
<?xml version="1.0" encoding="utf-8"?>
<ScrollView
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/ScrollView01"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:baselineAligned="true"
android:orientation="vertical"
android:background="#drawable/darkimg"
android:weightSum="1">
<LinearLayout
android:id="#+id/numbersLL"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical"
android:background="#drawable/round_rectangle"
android:layout_margin="4px"
android:paddingLeft="6px"
android:paddingTop="3px">
<TextView
android:id="#+id/numberPrint"
android:layout_height="wrap_content"
android:textSize="14px"
android:textStyle="bold"
android:textColor="#color/white"
android:layout_width="fill_parent"
android:text="#string/numberPrint">
</TextView>
<ListView
android:id="#+id/numberListView"
android:layout_width="fill_parent"
android:layout_height="0dp"
android:layout_weight="1"></ListView>
</LinearLayout>
</LinearLayout>
</ScrollView>
This is my footer:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="horizontal"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:id="#+id/formLL">
<TextView
android:id="#+id/numberFormTextViewt"
android:layout_gravity="center_vertical"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:textSize="20px"
android:text="Add a number:"
android:textColor="#color/white" />
<Button
android:id="#+id/numberFormButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/ic_add"></Button>
</LinearLayout>
And this is the Java code to add the footer to the list:
LayoutInflater factory = getLayoutInflater();
LinearLayout numberFooter = (LinearLayout) factory.inflate(R.layout.number_form, null);
// List of numbers
numberListView = (ListView) this.findViewById(R.id.numberListView);
numberListView.addFooterView(numberFooter);
What is going wrong here? The footer does not appear when the activity is displayed. One thing I should mention is the footer is used to add items to the list above it. I'm not sure if that makes a difference but when I am testing this the list adapter is empty. Even still should the footer show up anyway? Any help would be appreciated thanks.
List view under scroll view is not working(means List view is not scrollable).
So u can put empty Linear Layout instead of List view in ur xml file. In ur code, first u can get the list view size, based on this size value, for loop can rotated. In that for loop u can call the get view method of the adapter class(that class is not extending any class.) this will solve the list view problem.
try this in your listview:
android:layout_height="fill_parent"

Android Listview - first item is different

For some reason, the text has 0 width in the second row.
Code:
public LinearLayout getView(int position, View convertView, ViewGroup parent){
LinearLayout rowView;
if(convertView==null){
rowView=(LinearLayout) mActivity.getLayoutInflater().inflate(R.layout.icon_list, null);
}else{!
rowView=(LinearLayout) convertView;
}
//Image view
ImageView imageView=(ImageView) rowView.findViewById(R.id.list_icon);
Pair<String,Bitmap> p=getItem(position);
imageView.setImageBitmap(p.second);
//Text view
TextView textView=(TextView) rowView.findViewById(R.id.list_text);
textView.setText("AAAA");
return rowView;
}
XML:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="20dip"
android:id="#+id/icon_list"
android:padding="6dip">
<ImageView android:id="#+id/list_icon"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:layout_marginRight="6dip"
android:layout_gravity="left"/>
<TextView android:id="#+id/list_text"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:gravity="center_vertical"/>
</LinearLayout>
EDIT:
Before I had accidentally left in the line.
android:src="#drawable/icon"
I removed it, but the problem remains
This isn't a very good answer, but it worked well enough. I set the layout_width and layout_height of Android 45dip. This then caused everything to work properly. I still don't understand how it was allowed to ignore the android:layout_height="20dip" for the section.

Categories

Resources