How to visually highlight a particular ListView item

Question

I want to make a list, by scrolling which, the elements became in a certain position and the text of these elements became larger and could be edited.

The list should look something like this:

Should work as:

Those. the user scrolls our list (as in the first line) and in the second position is selected the list item (highlighted, for example, with other backgrounds and more text).

and it is necessary that the element got to the second position, it was possible to edit the text in it.

and all this should be as smooth as on the second screen ..

Tell me, how can I implement this?

Thanks in advance for your help!

Edit:

Thanks for attention

The question came out extensive initially because I wanted to show what I generally want to do in the end in order to initially choose the correct and optimal way to solve the problem.

A more specific question: how can I make a selection of a specific element (for example, the second from the top) with a different font size on the sheet? At the same time, when scrolling through the list, an element that falls into second place should change the font size.

Accepted Answer · 2015-10-07T06:19:17

In order for certain list items to specify a different view, it is necessary to create, in fact, the markup itself for each type of item - how they will look and in the adapter to override two methods:

getItemViewType(position) - contains a condition by which you can determine what kind of item to display in the current position. Returns the ID of this item.

getViewTypeCount() - returns the number of items of various types.

Create a simple list with two types of items: item_normal.xml - the general view and item_big.xml - the view with a larger font (the font size is set directly in the markup). I will not invent the markings themselves - they have to implement what items for each type will look like.

Custom adapter (the simplest example based on an ArrayAdapter is only the parts that are important for understanding):

 public class CustomAdapter extends ArrayAdapter { private LayoutInflater mInflater; private static final int TYPE_1 = 0; // идентификатор айтема первого типа private static final int TYPE_2 = 1; // идентификатор айтема второго типа private ArrayList mItems; public CustomAdapter(Context context, ArrayList items) { super(context, items); mInflater = (LayoutInflater)getSystemService(Context.LAYOUT_INFLATER_SERVICE); mItems = items; } public View getView(int position, View convertView, ViewGroup parent) { // получаем идентификатор вида айтема в текущей позиции int type = getItemViewType(position); View v = convertView; //инфлейтим разметку айтема для текущей позиции switch (type) { case TYPE_1: v = mInflater.inflate(R.layout.item_normal, null); break; case TYPE_2: v = mInflater.inflate(R.layout.item_big, null); break; default: } // Если айтемы разных видов содержат разные данные для отображения // то разделяем биндинг: // // switch (type) // { // case TYPE_1: // биндинг данных в айтем первого вида. // // break; // case TYPE_2: // биндинг данных в айтем второго вида. // // break; // } // // Так как в вашем случае данные в айтемах не меняются, то для обоих // биндинг одинаковый и его не нужно разделять. String text = mItems.get(position); // извлекаем данные TextView tv = (TextView) v.findViewById(R.id.text); tv.setText(text); // размещаем в айтем return v; } @Override public int getItemViewType(int position) { // Здесь нужно определить вторую видимую позицию // и вернуть идентификатор айтема второго типа // иначе - айтема первого типа // Надо подумать. return (twoPosition) ? TYPE_2 : TYPE_1; } @Override public int getViewTypeCount() { return 2; // два различных вида айтемов } }

Since in your case, the appearance of different items is no different than anything other than the color and size of the font, you specify all these differences directly in the markup - you do not need to bind the data separately.
In more complex cases, you can use any independent data for different types of items, which can contain completely different markup and share their content through a switch - case in a commented block.

In a real adapter it is better to use holders and other optimizations.

Now the problem is that I can’t figure out how to make one element seem to be in place and only a list item will be inserted into it.
This is the problem that you wrote about with comments "// Here you need to determine the second visible position // and return the identifier of the second type item // otherwise - the first type item // Need to think."
I am now thinking about your task and it was initially set incorrectly.
Most likely, you need to implement something based on this library , but not with strings, but with item threads.
And so, if you continue to “torment” ListView , it has a method getFirstVisiblePosition() , which returns the number of that position in the adapter, which is in the first visible position of the list.
From the adapter’s side, this doesn’t seem to be implemented, and my answer cannot be considered correct.

How to visually highlight a particular ListView item

1 answer 1

More articles: