How to make android listview scrollable?

How to make android listview scrollable? - android

I have two listviews, but they don't scroll. How do I correct this?
Here is my layout.xml
<?xml version="1.0" encoding="utf-8"?>
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:fillViewport="true" >
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:background="#drawable/backgrund" >
<!-- Header Starts -->
<LinearLayout
android:id="#+id/header"
android:layout_width="fill_parent"
android:layout_height="40dip"
android:layout_alignParentTop="true"
android:background="#layout/header" >
</LinearLayout>
<!-- Header Ends -->
<!-- Footer Start -->
<TextView
android:id="#+id/textAD"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignBottom="#+id/header"
android:layout_alignParentRight="true"
android:layout_marginBottom="14dp"
android:layout_marginRight="26dp"
android:text="Small Text"
android:textAppearance="?android:attr/textAppearanceSmall"
android:textColor="#FFFFFF" />
<ImageView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/header"
android:layout_gravity="center_horizontal"
android:focusable="false"
android:paddingBottom="5px"
android:paddingTop="10px"
android:src="#android:drawable/divider_horizontal_bright" />
<View
android:layout_width="fill_parent"
android:layout_height="1dip"
android:background="#000000"
android:focusable="false" />
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/linearLayout1"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_below="#+id/header"
android:orientation="vertical" >
<TextView
android:id="#+id/textm"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Malzemeler"
android:textSize="20dp"
android:textColor="#000000"/>
<EditText
android:id="#+id/editaramalzeme"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:ems="10" />
<Button
android:id="#+id/btnmalzlist"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:focusable="false"
android:text="Ara" />
<ListView
android:id="#+id/mylist"
android:layout_width="match_parent"
android:layout_height="420dp"
android:layout_weight="1"
android:background="#FFFFFF" >
</ListView>
<ListView
android:id="#+id/listsecili"
android:layout_width="wrap_content"
android:layout_height="210dp"
android:layout_weight="1"
android:background="#FFFFFF" >
</ListView>
<EditText
android:id="#+id/txtNot"
android:layout_width="match_parent"
android:layout_height="88dp"
android:ems="10"
android:gravity="top"
android:inputType="textMultiLine"
android:lines="6"
android:singleLine="false" >
<requestFocus />
</EditText>
</LinearLayout>
<Button
android:id="#+id/btnkaydet"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_below="#+id/linearLayout1"
android:text="malzeme ekle" />
<Button
android:id="#+id/btntoplugonder"
style="?android:attr/buttonStyleSmall"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignRight="#+id/textAD"
android:layout_below="#+id/btnkaydet"
android:text="toplu gonder" />
</RelativeLayout>
</ScrollView>**

Never put ListView in ScrollView. ListView itself is scrollable.

By default ListView is scrollable. Do not put ScrollView to the ListView

I know this question is 4-5 years old, but still, this might be useful:
Sometimes, if you have only a few elements that "exit the screen", the list might not scroll. That's because the operating system doesn't view it as actually exceeding the screen.
I'm saying this because I ran into this problem today - I only had 2 or 3 elements that were exceeding the screen limits, and my list wasn't scrollable. And it was a real mystery. As soon as I added a few more, it started to scroll.
So you have to make sure it's not a design problem at first, like the list appearing to go beyond the borders of the screen but in reality, "it doesn't", and adjust its dimensions and margin values and see if it's starting to "become scrollable". It did, for me.

Practically its not good to do. But if you want to do like this, just make listview's height fixed to wrap_content.
android:layout_height="wrap_content"

Listview so have inbuild scrolling capabilities. So you can not use listview inside scrollview. Encapsulate it in any other layout like LinearLayout or RelativeLayout.

This is my working code. you may try with this.
row.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/listEmployeeDetails"
android:layout_height="match_parent"
android:layout_width="match_parent"
android:layout_marginTop="5dp"
android:layout_marginBottom="5dp"
android:layout_gravity="center"
android:background="#ffffff">
<TextView android:id="#+id/tvEmpId"
android:layout_height="wrap_content"
android:textSize="12sp"
android:padding="2dp"
android:layout_width="0dp"
android:layout_weight="0.3"/>
<TextView android:id="#+id/tvNameEmp"
android:layout_height="wrap_content"
android:textSize="12sp"
android:padding="2dp"
android:layout_width="0dp"
android:layout_weight="0.5"/>
<TextView
android:layout_height="wrap_content"
android:id="#+id/tvStatusEmp"
android:textSize="12sp"
android:padding="2dp"
android:layout_width="0dp"
android:layout_weight="0.2"/>
</LinearLayout>
details.xml
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/listEmployeeDetails"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="#color/page_bg"
android:orientation="vertical" >
<LinearLayout
android:id="#+id/lLayoutGrid"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/page_bg"
android:orientation="vertical" >
................... others components here............................
<ListView
android:id="#+id/listView"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:alwaysDrawnWithCache="true"
android:dividerHeight="1dp"
android:horizontalSpacing="3dp"
android:scrollingCache="true"
android:smoothScrollbar="true"
android:stretchMode="columnWidth"
android:verticalSpacing="3dp"
android:layout_marginBottom="30dp">
</ListView>
</LinearLayout>
</RelativeLayout>
Adapter class :
import java.util.List;
import android.app.Activity;
import android.content.Context;
import android.graphics.Color;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.BaseAdapter;
import android.widget.TextView;
public class ListViewAdapter extends BaseAdapter {
private Context context;
private List<EmployeeBean> employeeList;
publicListViewAdapter(Context context, List<EmployeeBean> employeeList) {
this.context = context;
this.employeeList = employeeList;
}
public View getView(int position, View convertView, ViewGroup parent) {
View row = convertView;
EmployeeBeanHolder holder = null;
LayoutInflater inflater = ((Activity) context).getLayoutInflater();
row = inflater.inflate(R.layout.row, parent, false);
holder = new EmployeeBeanHolder();
holder.employeeBean = employeeList.get(position);
holder.tvEmpId = (TextView) row.findViewById(R.id.tvEmpId);
holder.tvName = (TextView) row.findViewById(R.id.tvNameEmp);
holder.tvStatus = (TextView) row.findViewById(R.id.tvStatusEmp);
row.setTag(holder);
holder.tvEmpId.setText(holder.employeeBean.getEmpId());
holder.tvName.setText(holder.employeeBean.getName());
holder.tvStatus.setText(holder.employeeBean.getStatus());
if (position % 2 == 0) {
row.setBackgroundColor(Color.rgb(213, 229, 241));
} else {
row.setBackgroundColor(Color.rgb(255, 255, 255));
}
return row;
}
public static class EmployeeBeanHolder {
EmployeeBean employeeBean;
TextView tvEmpId;
TextView tvName;
TextView tvStatus;
}
#Override
public int getCount() {
return employeeList.size();
}
#Override
public Object getItem(int position) {
return null;
}
#Override
public long getItemId(int position) {
return 0;
}
}
employee bean class:
public class EmployeeBean {
private String empId;
private String name;
private String status;
public EmployeeBean(){
}
public EmployeeBean(String empId, String name, String status) {
this.empId= empId;
this.name = name;
this.status = status;
}
public String getEmpId() {
return empId;
}
public void setEmpId(String empId) {
this.empId= empId;
}
public String getName() {
return name;
}
public void setName(String name) {
this.name = name;
}
public String getStatus() {
return status;
}
public void setStatus(String status) {
this.status =status;
}
}
in Activity class:
onCreate method:
public static List<EmployeeBean> EMPLOYEE_LIST = new ArrayList<EmployeeBean>();
//create emplyee data
for(int i=0;i<=10;i++) {
EmployeeBean emplyee = new EmployeeBean("EmpId"+i,"Name "+i, "Active");
EMPLOYEE_LIST .add(emplyee );
}
ListView listView;
listView = (ListView) findViewById(R.id.listView);
listView.setAdapter(new ListViewAdapter(this, EMPLOYEE_LIST));

Putting ListView inside a ScrollView is never inspired.
But if you want your posted XML-like behavior, there're 3 options to me:
Remove ScrollView: Removing your ScrollView, you may give the ListViews some specific size with respect to the total layout (either specific dp or layout_weight).
Replace ListViews with LinearLayouts: You may add the list-items by iterating through the item-list and add each item-view to the respective LinearLayout by inflating the view & setting the respective data (string, image etc.)
If you really need to put your ListViews inside the ScrollView, you must make your ListViews non-scrollable (Which is practically the same as the solution 2 above, but with ListView codes), otherwise the layout won't function as you expect.
To make a ListView non-scrollable, you may read this SO post, where the precise solution to me is like the one below:
listView.setOnTouchListener(new OnTouchListener() {
public boolean onTouch(View v, MotionEvent event) {
return (event.getAction() == MotionEvent.ACTION_MOVE);
}
});

I found a tricky solution... which works only in a RelativeLayout.
We only need to put a View above a ListView and set clickable 'true' on View and false for the ListView
<ListView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/listview
android:clickable="false" />
<View
android:layout_width="match_parent"
android:background="#drawable/gradient_white"
android:layout_height="match_parent"
android:clickable="true"
android:layout_centerHorizontal="true"
android:layout_alignTop="#+id/listview" />

I had this problem and I found the solution. In my case the listView was bigger than the screen, so the list was not big enough to need scroll, but I coudn´t see it because half list was out of screen.
I solved it adding enough marginBotton to make the listView shorter and it suits to the screen.
<ListView
android:id="#+id/lvDatos"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginBottom="300dp"/>

Related

Why Custom ArrayAdapter not showing TextView in a ListView

I have made a custom ArrayAdapter and tried to add the another TextView "Breed" of the animals, but when i execute the program , its not showing the Breed. Where am i doing wrong ? I am scratching my head since long. please help where is the mistake ?
MainActivity.Java
public class MainActivity extends AppCompatActivity {
ListView simpleList;
ArrayList<Item> animalList=new ArrayList<>();
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
simpleList = (ListView) findViewById(R.id.simpleListView);
animalList.add(new Item("Lion",R.drawable.lion,"Khatarnak"));
animalList.add(new Item("Tiger",R.drawable.tiger,"Fudu"));
animalList.add(new Item("Monkey",R.drawable.monkey,"Lallu"));
animalList.add(new Item("Elephant",R.drawable.elephant,"Jabardast"));
animalList.add(new Item("Dog",R.drawable.dog,"ItemDog"));
animalList.add(new Item("Cat",R.drawable.cat,"MeeMee"));
MyAdapter myAdapter=new MyAdapter(this,R.layout.list_view_items,animalList);
simpleList.setAdapter(myAdapter);
}
}
MyAdapter.Java
public class MyAdapter extends ArrayAdapter<Item> {
ArrayList<Item> animalList = new ArrayList<>();
public MyAdapter(Context context, int textViewResourceId, ArrayList<Item> objects) {
super(context, textViewResourceId, objects);
animalList = objects;
}
#Override
public int getCount() {
return super.getCount();
}
#Override
public View getView(int position, View convertView, ViewGroup parent) {
View v = convertView;
LayoutInflater inflater = (LayoutInflater) getContext().getSystemService(Context.LAYOUT_INFLATER_SERVICE);
v = inflater.inflate(R.layout.list_view_items, null);
TextView textView = (TextView) v.findViewById(R.id.textView);
ImageView imageView = (ImageView) v.findViewById(R.id.imageView);
TextView breedView = (TextView)v.findViewById(R.id.breed);
textView.setText(animalList.get(position).getAnimalName());
imageView.setImageResource(animalList.get(position).getAnimalImage());
breedView.setText(animalList.get(position).getBreed());
return v;
}
}
Item.Java
public class Item {
String animalName;
int animalImage;
String breedName;
public String getBreed() {
return breedName;
}
public void setBreed(String breed) {
this.breedName = breedName;
}
public Item(String animalName,int animalImage,String breedName)
{
this.animalImage=animalImage;
this.animalName=animalName;
this.breedName = breedName;
}
public String getAnimalName()
{
return animalName;
}
public int getAnimalImage()
{
return animalImage;
}
}
activity_main.xml
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity">
<ListView
android:id="#+id/simpleListView"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:divider="#000"
android:dividerHeight="2dp"/>
</RelativeLayout>
list_view_items.xml
<?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="wrap_content"
android:orientation="horizontal">
<ImageView
android:id="#+id/imageView"
android:layout_width="50dp"
android:layout_height="50dp"
android:padding="5dp" />
<TextView
android:id="#+id/textView"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:text="Demo"
android:textColor="#000" />
<TextView
android:id="#+id/breed"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:text="Breed"
android:textColor="#000" />
</LinearLayout>

This is most likely a problem with the linear layout for each item. The orientation is horizontal, which lays each view one after the other horizontally. The problem is that the text view for the animal type has a width of fill_parent leaving no space for the breed view. If you change it to wrap_content it'll probably work for some of the cases, but might not work with everything.
In any case I think this is a problem with the views' positions and sizes. Try and move them around. Perhaps even a simple change would be placing them vertically:
<?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="wrap_content"
android:orientation="horizontal">
<ImageView
android:id="#+id/imageView"
android:layout_width="50dp"
android:layout_height="50dp"
android:padding="5dp" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<TextView
android:id="#+id/textView"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:text="Demo"
android:textColor="#000" />
<TextView
android:id="#+id/breed"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:text="Breed"
android:textColor="#000" />
</LinearLayout>
</LinearLayout>
There's perhaps a more efficient way of doing this, but this is just an example. The inner linear layout places one text view on to of the other.
PS: your getCount method is not really doing anything. You can remove it.

replace your layout with my code your issue will resolve.
<?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="wrap_content"
android:orientation="horizontal">
<ImageView
android:id="#+id/imageView"
android:layout_width="50dp"
android:layout_height="50dp"
android:padding="5dp" />
<TextView
android:id="#+id/textView"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_weight="1"
android:text="Demo"
android:textColor="#000" />
<TextView
android:id="#+id/breed"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:text="Breed"
android:textColor="#000" />
</LinearLayout>

Why does relative layout in listview not expand correctly with content when font is huge

I have a list view that for each item needs to display an image, a book title, the author and the price. Under normal circumstances my output is fine and looks like the following
My client has a large portion of customers that need to set the font size to huge. When this is done and the authors name is very long my output looks like below
This is not right and I would like it to look like this instead
In other words the height of list view and elements inside grow to fit larger amounts of text.
Here is the code which replicates my problem.
The book class
public class Book {
public String name;
public String author;
public String price;
public Book(String name, String author, String price){
this.name = name;
this.author = author;
this.price = price;
}
}
The main activity code
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.widget.ListView;
import java.util.ArrayList;
public class MainActivity extends AppCompatActivity {
ListView listView;
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
listView = (ListView) findViewById(R.id.list);
ArrayList<Book> bookList = new ArrayList<Book>();
bookList.add(new Book("Book 1", "By Christopher Christopheson", "£0.50"));
bookList.add(new Book("Book 2", "Author 2", "£0.75"));
BookAdapter adapter = new BookAdapter(this, R.layout.row, bookList);
listView.setAdapter(adapter);
}
}
The book list view adapter
import android.content.Context;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.ArrayAdapter;
import java.util.ArrayList;
import android.widget.TextView;
public class BookAdapter extends ArrayAdapter<Book> {
private ArrayList<Book> items;
private LayoutInflater lInflater;
public BookAdapter(Context context, int textViewResourceId, ArrayList<Book> items){
super(context, textViewResourceId, items);
lInflater = (LayoutInflater)context.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
this.items = items;
}
#Override
public View getView(int position, View convertView, ViewGroup parent){
View v = convertView;
if(v == null){
v = lInflater.inflate(R.layout.row, null);
}
Book b = items.get(position);
if(b!= null){
TextView bookName = (TextView)v.findViewById(R.id.book_name);
TextView bookPrice = (TextView)v.findViewById(R.id.book_price);
TextView bookAuthor = (TextView)v.findViewById(R.id.book_author);
if(bookName != null){
bookName.setText(b.name);
}
if(bookPrice != null){
bookPrice.setText(b.price);
}
if(bookAuthor != null){
bookAuthor.setText(b.author);
}
}
return v;
}
}
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="barnetttabs.com.basiclistview.MainActivity">
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#000"
android:orientation="vertical" >
<ListView
android:id="#+id/list"
android:layout_height="wrap_content"
android:layout_width="match_parent">
</ListView>
</LinearLayout>
</android.support.constraint.ConstraintLayout>
row.xml
<?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"
android:minHeight="150dp"
android:paddingTop="4dp"
android:paddingBottom="4dp"
>
<TextView
android:id="#+id/price_background"
android:layout_width="150dp"
android:layout_height="wrap_content"
android:minHeight="150dp"
android:layout_alignParentRight="true"
android:layout_alignParentBottom="true"
android:layout_alignParentTop="true"
android:background="#0000ff"
/>
<TextView
android:id="#+id/book_name"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="17sp"
android:minHeight="150dp"
android:layout_toLeftOf="#id/price_background"
android:layout_alignParentLeft="true"
android:gravity="top"
android:background="#d3d3d3"
android:layout_alignParentTop="true"
android:layout_alignParentBottom="true"
android:paddingLeft="110dp"
android:paddingRight="4dp"
/>
<ImageView
android:id="#+id/book_image"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:src="#drawable/lvplaceholderimage"
/>
<TextView
android:id="#+id/book_price"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignTop="#id/book_image"
android:textSize="17sp"
android:layout_alignLeft="#id/price_background"
android:layout_alignParentRight="true"
android:textColor="#fff"
android:paddingLeft="4dp"
android:paddingRight="4dp"
android:paddingTop="4dp"
/>
<TextView
android:id="#+id/book_author"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="17sp"
android:layout_alignLeft="#id/price_background"
android:layout_alignParentRight="true"
android:layout_alignParentBottom="true"
android:layout_below="#id/book_price"
android:paddingLeft="4dp"
android:paddingRight="4dp"
android:paddingBottom="4dp"
/>
</RelativeLayout>
I've tried fixing the layout_height of the relative layout in row.xml. This keeps the height consistent but when the author is too long some of the text is hidden. When I've searched for solutions on this most things say the solution is to set height as wrap_content which I have done but it doesn't the problem.
Is there a way to fix this through either changing the xml layout or the java code? Maybe the relative layout I've used here in row.xml is not the right approach?

Chetan's suggestion was the way to go. The basic idea is to change from a relative layout to a horizontal linear layout. The middle portion is given weight 0 and the 2 end bits have their lengths set as before. The only drawback is the method needs to have a nested layout to get the blue bit to work but hopefully not too much of a performance hit.
In activity_main.xml change the listview code to
<ListView
android:id="#+id/list"
android:layout_height="wrap_content"
android:divider="#android:color/transparent"
android:dividerHeight="5.0sp"
android:layout_width="match_parent">
</ListView>
Change row.xml 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="wrap_content"
android:minHeight="150dp"
android:layout_marginTop="8dp"
android:layout_marginBottom="8dp"
android:orientation="horizontal"
android:background="#d3d3d3"
>
<ImageView
android:id="#+id/book_image"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/lvplaceholderimage"
android:layout_gravity="top"
/>
<TextView
android:id="#+id/book_name"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:textSize="17sp"
android:layout_gravity="top"
android:paddingLeft="4dp"
android:paddingRight="4dp"
android:layout_weight="1"
/>
<RelativeLayout
android:layout_width="150dp"
android:layout_height="wrap_content"
android:minHeight="150dp"
android:background="#0000ff">
<TextView
android:id="#+id/book_price"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="17sp"
android:layout_alignParentTop="true"
android:textColor="#fff"
android:paddingLeft="4dp"
android:paddingRight="4dp"
android:paddingTop="4dp"
/>
<TextView
android:id="#+id/book_author"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="17sp"
android:layout_below="#id/book_price"
android:layout_alignParentBottom="true"
android:paddingLeft="4dp"
android:paddingRight="4dp"
android:paddingBottom="4dp"
/>
</RelativeLayout>
</LinearLayout>
Then it looks like this

Why are adjacent Buttons moving when I change the size of the text in a Button

Here is the layout when each Button has the same size text:
And here is the layout when I increase the size of the bottom right Button's text:
What's going on here? Why is the "0" Button moving lower than the two Buttons adjacent to it?
Here is the layout:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:background="#android:color/white"
android:orientation="vertical"
android:padding="6dp">
<TextView
android:id="#+id/input_textview"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:textColorHint="#color/hint_color"
android:singleLine="true"
android:textSize="40sp"/>
<GridLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:columnCount="3">
<Button
android:id="#+id/the_1_button"
android:background="#android:color/white"
android:text="1"/>
<Button
android:id="#+id/the_2_button"
android:background="#android:color/white"
android:text="2"/>
<Button
android:id="#+id/the_3_button"
android:background="#android:color/white"
android:text="3"/>
<Button
android:id="#+id/the_4_button"
android:background="#android:color/white"
android:text="4"/>
<Button
android:id="#+id/the_5_button"
android:background="#android:color/white"
android:text="5"/>
<Button
android:id="#+id/the_6_button"
android:background="#android:color/white"
android:text="6"/>
<Button
android:id="#+id/the_7_button"
android:background="#android:color/white"
android:text="7"/>
<Button
android:id="#+id/the_8_button"
android:background="#android:color/white"
android:text="8"/>
<Button
android:id="#+id/the_9_button"
android:background="#android:color/white"
android:text="9"/>
<ImageButton
android:id="#+id/the_backspace_button"
style="#style/Widget.AppCompat.Button"
android:background="#android:color/white"
android:src="#drawable/ic_backspace"/>
<Button
android:id="#+id/the_0_button"
android:background="#android:color/white"
android:text="0"/>
<Button
android:id="#+id/the_done_button"
android:layout_width="88dp"
android:layout_height="48dp"
android:minWidth="0dp"
android:minHeight="0dp"
android:background="#android:color/white"
android:text="done"/>
</GridLayout>
</LinearLayout>
Update:
I made the text of the "DONE" Button super large -- 100sp -- and set maxWidth and maxHeight for it equal to the height and width of the other Buttons. Here is the result:
*the blue is the GridLayout's background, the red the "0" Button's, and the yellow the "DONE" Button's
Why would changing the size of the text of the "DONE" Button affect anything other than that specific Button if the size of the Button never changes?

I think there is a problem with the done button. You set the background of it. Then you also set its text as "done" .
Just set it text empty and the problem may resolve ;)

What about using the grid:layout_rowWeight or grid:layout_rowHeight attributes to be the same for every button?
Look at this:
https://stackoverflow.com/a/32291319/2205825

Try this .....
Use GridView instead of many Button that not give you any Layout problem (Adjustment of Views).
Have look on the below example that solve your problem about Adjustment of Buttons
use this layout instead of your layout .....
<?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="vertical"
android:padding="6dp">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1">
<TextView
android:id="#+id/input_textview"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:singleLine="true"
android:textSize="40sp" />
</LinearLayout>
<GridView
android:id="#+id/gridview"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:columnWidth="100dp"
android:gravity="center"
android:numColumns="3" />
</LinearLayout>
add these 2 line in your OnCreate method .....
GridView gridview = (GridView) findViewById(R.id.gridview);
gridview.setAdapter(new CustomAdapter(this));
add this adapter in your project .....
import android.app.Activity;
import android.content.Context;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.BaseAdapter;
import android.widget.Button;
import android.widget.ImageButton;
/**
* Created by sushildlh on 10/14/16.
*/
public class CustomAdapter extends BaseAdapter {
private Context mContext;
// Keep all Images in array
public String[] text = {
"1", "2", "3", "4", "5", "6", "7", "8", "9", "", "0", "DONE"
};
// Constructor
public CustomAdapter(Context c) {
mContext = c;
}
public int getCount() {
return 12;
}
public Object getItem(int position) {
return null;
}
public long getItemId(int position) {
return 0;
}
// create a new textView for each item referenced by the Adapter
public View getView(int position, View convertView, ViewGroup parent) {
Holder holder = null;
if (holder == null) {
LayoutInflater inflater = ((Activity) mContext).getLayoutInflater();
convertView = inflater.inflate(R.layout.item, parent, false);
holder = new Holder();
holder.button = (Button) convertView.findViewById(R.id.button);
holder.image = (ImageButton) convertView.findViewById(R.id.image);
convertView.setTag(holder);
} else {
holder = (Holder) convertView.getTag();
}
if (position != 9) {
holder.image.setVisibility(View.GONE);
holder.button.setText(text[position]);
} else {
holder.image.setImageResource(R.drawable.ic_backspace_black_24dp); //change ic_backspace_black_24dp into to your image ......
holder.button.setVisibility(View.GONE);
}
return convertView;
}
public static class Holder {
Button button;
ImageButton image;
}
}
and this is item.xml layout into your layout folder ....
<?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="vertical">
<Button
android:id="#+id/button"
android:layout_width="100dp"
android:layout_height="60dp"
android:gravity="center"
android:background="#null"
android:textSize="25dp"/>
<ImageButton
android:id="#+id/image"
android:layout_width="100dp"
android:layout_height="60dp"
android:focusable="false"
android:background="#null"
android:gravity="center" />
</LinearLayout>
above code give you the output like this ....
Note:- Always use GridView OR ListView for same pattern of Views .....

You can use the android:layout_weight property.

It appears that the GridLayout is reserving enough height for the actual text size and some default padding despite the layout_height for the Done button.

Build it with 'Linear Layouts' instead.

Was facing the same problem, so just i did was to change the height and width of the button to it parent RowTable's match parent & wrap content and it solved my problem

Android GridView not showing any images

I have followed the example at https://developer.android.com/guide/topics/ui/layout/gridview.html and used other resources on SO to make it at least not crash given I'm using the grid view in a fragment.
I'm trying to just get a list of images to show in the grid view (for simplicity I've just put the same image twice in mThumbIds in ImageAdapter).
But when I run the app, no GridView at all is showing in the fragment. Other views in the fragment load fine, but it's like the gridview isn't even there. I'm not really sure how to debug this.
Any help is appreciated, thanks.
ImageAdapter.java:
import android.content.Context;
import android.view.View;
import android.view.ViewGroup;
import android.widget.BaseAdapter;
import android.widget.GridView;
import android.widget.ImageView;
public class ImageAdapter extends BaseAdapter {
private Context mContext;
public ImageAdapter(Context c) {
mContext = c;
}
public int getCount() {
return mThumbIds.length;
}
public Object getItem(int position) {
return null;
}
public long getItemId(int position) {
return 0;
}
// create a new ImageView for each item referenced by the Adapter
public View getView(int position, View convertView, ViewGroup parent) {
ImageView imageView;
if (convertView == null) {
// if it's not recycled, initialize some attributes
imageView = new ImageView(mContext);
imageView.setLayoutParams(new GridView.LayoutParams(85, 85));
imageView.setScaleType(ImageView.ScaleType.CENTER_CROP);
imageView.setPadding(8, 8, 8, 8);
} else {
imageView = (ImageView) convertView;
}
imageView.setImageResource(mThumbIds[position]);
return imageView;
}
// references to our images
private Integer[] mThumbIds = {
R.drawable.placeholder, R.drawable.placeholder
};
}
PlaceholderFragment:
public static class PlaceholderFragment extends Fragment
{
...
#Override
public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState)
{
View rootView = inflater.inflate(R.layout.fragment_items, container, false);
TextView textView = (TextView) rootView.findViewById(R.id.items_subheading);
textView.setText(getString(R.string.section_format, getArguments().getInt(ARG_SECTION_NUMBER)));
GridView allImages = (GridView) rootView.findViewById(R.id.items_all_images);
allImages.setAdapter(new ImageAdapter(rootView.getContext()));
allImages.setOnItemClickListener(new AdapterView.OnItemClickListener() {
public void onItemClick(AdapterView<?> parent, View v, int position, long id)
{
// empty
}
});
return rootView;
}
fragment_items.xml
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingBottom="#dimen/activity_vertical_margin"
android:paddingLeft="#dimen/activity_horizontal_margin"
android:paddingRight="#dimen/activity_horizontal_margin"
android:paddingTop="#dimen/activity_vertical_margin"
tools:context="com.example.myapp.ItemsActivity$PlaceholderFragment">
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="horizontal" >
<LinearLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="2"
android:gravity="top|left"
android:orientation="vertical">
<ImageView
android:id="#+id/items_image"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/placeholder"
android:scaleType="fitStart"
style="#style/ItemsImage" />
<GridView
android:id="#+id/items_all_images"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:columnWidth="20dp"
android:numColumns="auto_fit"
android:verticalSpacing="10dp"
android:horizontalSpacing="10dp"
android:gravity="center"
android:background="#000000"
/>
</LinearLayout>
<LinearLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="3"
android:orientation="vertical"
android:background="#drawable/items_border">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<!-- About 10 text views -->
</LinearLayout>
</LinearLayout>
</LinearLayout>
Edit
Aiming for:
Edit 2
Solution: Figured it out! Needed android:adjustViewBounds="true" on the ImageView. Without that attribute it seemed to be taking unlimited space below its position.

I think that you have an issue with the LinearLayout who wraps the GridView your LinearLayout is a vertical linear layout so if you use weight the height of the GridView should be 0dp and in your code the height is wrap_content and the width is 0dp so please change the height to 0dp and the width to wrap_content or match_parent
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="0dp"
android:layout_weight="2"
android:gravity="top|left"
android:orientation="vertical">
<GridView
android:id="#+id/items_all_images"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:columnWidth="20dp"
android:numColumns="auto_fit"
android:verticalSpacing="10dp"
android:horizontalSpacing="10dp"
android:gravity="center"
/>
UPDATE
According to your mock i think this is what i would do:
<?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:padding="5dp"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<TextView
android:layout_width="wrap_content"
android:text="text1"
android:layout_height="wrap_content" />
<TextView
android:layout_width="wrap_content"
android:text="text1"
android:layout_height="wrap_content" />
<TextView
android:layout_width="wrap_content"
android:text="text1"
android:layout_height="wrap_content" />
<!-- If the number of textviews is dynamic and not fixed then it's better to use ListView
with adapter
-->
<!--<ListView-->
<!--android:id="#android:id/list"-->
<!--android:layout_width="match_parent"-->
<!--android:layout_height="wrap_content" />-->
</LinearLayout>
<GridView
android:id="#+id/items_all_images"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#android:color/holo_green_dark"
android:layout_marginTop="5dp"
android:columnWidth="20dp"
android:gravity="center"
android:horizontalSpacing="10dp"
android:numColumns="auto_fit"
android:verticalSpacing="10dp" />
</LinearLayout>
Please notice if your textviews are not fixed (can be 3 or more ...) then you will need to use ListView with adapter. So each line item in the ListView will be a TextView

Is there anything equivalent to setImageResource for buttons?

I am creating a custom adapter so that I can put a button in a listView. I was putting it in just like I would an image and then I got to this line of code in the tutorial:
button.setImageResource(current_item.getButton_id());
I tried changing it to setButtonResource, but there is no method for that.
Thanks for any help.
I want it to look like this where there is a listview with a textview and a button. I got the text put in just fine, but I can't figure out how to get a button in ther listview.
This is my adapter:
private class MyListAdapter extends ArrayAdapter<SchoolsListClass>{
public MyListAdapter() {
super(searchResults.this, R.layout.da_item, mySchools);
}
#Override
public View getView(int position, View convertView, ViewGroup parent) {
//Make sure we have a view to work with (may have been given null
View itemView = convertView;
if (itemView == null){
itemView = getLayoutInflater().inflate(R.layout.da_item, parent, false);
}
//Find school to work with
SchoolsListClass currentSchoolsListClass = mySchools.get(position);
//Fill the view
//school name
TextView schoolText = (TextView) itemView.findViewById(R.id.item_schoolName);
schoolText.setText(currentSchoolsListClass.getSchool_name());
//subscribe/unsubscribe button
Button button = (Button)itemView.findViewById(R.id.item_subscribeButton);
button..setImageResource(currentSchoolsListClass.getButton_id());//This is the line of code I am having trouble with. I want it to do exactly what it is doing for images, but use buttons instead of images.
return itemView;
}
SchoolsListClass:
package com.parse.starter;
public class SchoolsListClass {
private String school_name;
private int button_id;
public SchoolsListClass(String school, int button){
super();
this.school_name = school;
this.button_id = button;
}
public String getSchool_name() {
return school_name;
}
public int getButton_id() {
return button_id;
}
}
school_results.xml:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/listMain"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<TextView
android:id="#+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true"
android:layout_marginTop="18dp"
android:text="Title"
android:textAppearance="?android:attr/textAppearanceLarge" />
<ListView
android:id="#+id/schoolListView"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/textView1"
android:layout_centerHorizontal="true" >
</ListView>
</RelativeLayout>
da_item.xml:(sample for items in my listview)
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/itemLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_alignParentTop="true"
android:layout_marginLeft="4dp" >
<TextView
android:id="#+id/item_schoolName"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignBottom="#+id/item_subscribeButton"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:layout_toLeftOf="#+id/item_subscribeButton"
android:ellipsize="end"
android:text="Central Wisconsin Christian School"
android:textSize="#dimen/school_name_size" />
<Button
android:id="#+id/item_subscribeButton"
style="?android:attr/buttonStyleSmall"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_alignParentTop="true"
android:text="Button" />
</RelativeLayout>

the equivalent is
button.setBackgroundResource(int resid);

you can use but it is debricated in new API
button.setBackgroundDrawable(R.drawable.ic_launcher);

Develop Reference

The Android operating system is a mobile operating system that was developed by Google (GOOGL?) to be primarily used for touchscreen devices, cell phones, and tablets.

How to make android listview scrollable? - android

Never put ListView in ScrollView. ListView itself is scrollable.

By default ListView is scrollable. Do not put ScrollView to the ListView

Practically its not good to do. But if you want to do like this, just make listview's height fixed to wrap_content. android:layout_height="wrap_content"

Listview so have inbuild scrolling capabilities. So you can not use listview inside scrollview. Encapsulate it in any other layout like LinearLayout or RelativeLayout.

Related

Why Custom ArrayAdapter not showing TextView in a ListView

Why does relative layout in listview not expand correctly with content when font is huge

Why are adjacent Buttons moving when I change the size of the text in a Button

Android GridView not showing any images

Is there anything equivalent to setImageResource for buttons?

Categories

Resources