How to implement Scroll View with views getting aligned at the top? - android

I came across this UI and am trying to use it.
In the image what I guess is, the root layout is a Scroll view.
The top view inside the ScrollView is Relative layout and below it is ListView which gets loaded depending on the dates selected. (not sure)
When the view is scrolled up the button present on the top View aligns itself to the top of the parent layout.
And then the rest is scrolled like a listview.
When scrolled down again the top view is visible.
NB: I have tried to apply what I feel like has been used for such effect. But I am not able to align the button of the top view to the parent layout. If needed I can post the code.
Please help me to find what exactly is the logic behind this effect.
Thanks.
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:paddingLeft="#dimen/activity_horizontal_margin"
android:paddingRight="#dimen/activity_horizontal_margin"
android:paddingTop="#dimen/activity_vertical_margin"
android:paddingBottom="#dimen/activity_vertical_margin"
tools:context="com.mypackage.Appointments_Main_ActivityFragment">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<LinearLayout
android:layout_width="match_parent"
android:orientation="vertical"
android:id="#+id/linear"
android:layout_height="wrap_content">
<TextView
android:text="From Date"
android:id="#+id/frm"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="14dip"
android:textStyle="bold"
android:layout_marginRight="5dip" />
<TextView
android:text="To Date"
android:id="#+id/to"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="14dip"
android:textStyle="bold"
android:layout_marginRight="5dip" />
</LinearLayout>
<Button
android:id="#+id/alertbtn"
android:layout_below="#id/linear"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:background="#color/DarkGray"
android:padding="16dp"
android:text="Alerts"
android:textColor="#color/accentforGray" />
<ListView
android:layout_below="#id/alertbtn"
android:id="#+id/listView1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="10dip"
android:background="#B29090" >
</ListView>
</RelativeLayout>

I solved the problem myself.
For getting the same look and feel as mentioned in the image.
I did the following:
1) Defined 3 layouts used in ListView.
list_top_one -> for top view having from date and to date text view
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical" android:layout_width="match_parent"
android:layout_height="match_parent">
<TextView
android:id="#+id/frmdate"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:padding="16dp"
android:text="from date"/>
<TextView
android:id="#+id/todate"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:padding="16dp"
android:text="to date"/>
</LinearLayout>
b) list_item_in_middle -> for having button like feel
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical" android:layout_width="match_parent"
android:layout_height="wrap_content"
android:padding="16dp"
android:id="#+id/llHeader">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#drawable/btn_background"
android:text="OK"
android:padding="16dp"/>
</LinearLayout>
c) list_items -> for holding the dynamically loaded value.
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#FFBB00"
android:orientation="vertical" >
<TextView
android:textColor="#000"
android:layout_margin="30dp"
android:id="#+id/button1"
android:layout_gravity="center"
android:text="OK"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
</LinearLayout>
2) Main activity layout.
a) Contains a listview
b) And includes a layout that is to be shown as button.
<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/listview"
android:layout_width="match_parent"
android:layout_height="match_parent">
</ListView>
<!-- This LinearLayout's visibility is toggled -->
<include layout="#layout/list_item_in_middle" />
</RelativeLayout>
Reference:
Making a middle element to get stuck in the header (ScrollView/ListView)
3) ListAdapter class
public class ListAdapter extends BaseAdapter {
public Context mContext;
TextView btCurrent;
ArrayList<Integer> newarrays = new ArrayList<>();
ListAdapter(Context context,Integer[] arrval) {
mContext = context;
newarrays.addAll(Arrays.asList(arrval));
}
public void InitializeValues(Integer[] arrval){
newarrays.addAll(Arrays.asList(arrval));
}
#Override
public int getCount() {
return newarrays.size();
}
#Override
public Object getItem(int arg0) {
return newarrays.get(arg0);
}
#Override
public long getItemId(int position) {
return 0;
}
#Override
public View getView(int position, View convertView, ViewGroup parent) {
LayoutInflater inflater = (LayoutInflater) mContext.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
if(position == 0){
convertView = inflater.inflate(R.layout.list_item_in_middle, null);//Adding btn layout
}else {
convertView = inflater.inflate(R.layout.list_items, null);// Adding other elements
btCurrent = (TextView) convertView.findViewById(R.id.button1);
if ((Integer) getItem(position) == 3) {
btCurrent.setText("Number " + getItem(position) + " is sticky");
} else {
btCurrent.setText("" + getItem(position));
}
}
return convertView;
}
}
4) MainActivity
a) OnScrollListener for attaching the btn like list item on top.
llHeader = (LinearLayout) findViewById(R.id.llHeader);//from the list_item_in_middle layout
listView.setOnScrollListener(new AbsListView.OnScrollListener() {
#Override
public void onScrollStateChanged(AbsListView view, int scrollState) {
}
#Override
public void onScroll(AbsListView view, int firstVisibleItem, int visibleItemCount, int totalItemCount) {
if (firstVisibleItem > 0) { // 1st row will stick
llHeader.setVisibility(View.VISIBLE);
} else {
llHeader.setVisibility(View.GONE);
}
}
});
b) OnItemClickListener of listview
listView.setOnItemClickListener(new AdapterView.OnItemClickListener() {
#Override
public void onItemClick(AdapterView<?> parent, View view, int position, long id) {
int a = 0;
if(position == 0){//for clicking from date and to date.
TextView frm = (TextView) view.findViewById(R.id.frmdate);
frm.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View v) {
Toast.makeText(MainActivity.this,"From date clicked",Toast.LENGTH_SHORT).show();
}
});
TextView to = (TextView) view.findViewById(R.id.todate);
to.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View v) {
Toast.makeText(MainActivity.this,"to date clicked",Toast.LENGTH_SHORT).show();
}
});
}else {
if(position == 1) {//for clicking the btn like list element.
swap();
Toast.makeText(MainActivity.this,"Header clicked",Toast.LENGTH_SHORT).show();
}else {
Toast.makeText(MainActivity.this, parent.getItemAtPosition(position).toString(), Toast.LENGTH_SHORT).show();
}
}
}
});
c) Linearlayout click function for element that gets stuck to the top
llHeader.setOnClickListener(new View.OnClickListener() { //for clicking the elements that gets stuck to the top
#Override
public void onClick(View v) {
swap();
Toast.makeText(MainActivity.this,"Header clicked",Toast.LENGTH_SHORT).show();
}
});
d) swap function called from linearlayout and the list element at position 1
public void swap(){
ltAdapter.notifyDataSetChanged();
new1 = new Integer[]{20, 21, 22, 23, 24, 25, 26, 27, 28};
ltAdapter.InitializeValues(new1);
}
NB:If any focusable view is taken in the listview, the OnItemclickListener doesnot work, read in stackoverflow itself
Finally the output:
before the second element click
after clicking
after scrolling

I think it happens in this way: when you scroll the page, linear layout gets invisible successfully but when you reache the button by doing scroll, the focus goes to listview and so it makes listview to scrolls instead of the whole page.
Do a fast scroll or scroll the page by swiping the button, not the listview and check if botton gets invisible.

Related

Android ListView DPAD navigation: Why do I have to the click up button twice to scroll up?

I am navigating a simple listView with a remote control, using DPAD_UP to go up & DPAD_DOWN to go down the list. I am not doing anything special beyond the vanilla stuff you see going on below. Each time I click the down button it scrolls to the next row down just fine. However, when going the reverse direction (i.e. clicking the up button) I have to click it twice to scroll up a row except for a select few # of rows which consistently work.
Each time I click the up button the OnItemSelectedListener is fired. For example, I am at position 10, I hit the up button, onItemSelected(pos=10) is fired. I hit the up button again, now the listview scrolls up and onItemSelected(pos=9) is fired. I repeat, no change in listView & onItemSelected(pos=9), etc.
Using Jelly Bean, API Level 17, this is not touchscreen.
Fragment Code:
import android.support.v4.app.Fragment;
import android.widget.ListView;
...
public class MyFragment extends Fragment {
ListView mListView = null;
ChListAdapter mChListAdapter = null;
...
#Override onCreateView(...) {
mListView = (ListView) parentView.findViewById(R.id.chListView);
mChListAdapter = new ChListAdapter()
mListView.setAdapter(mChListAdapter);
mListView.setOnItemSelectedListener(new OnItemSelectedListener() {
#Override
public void onItemSelected(AdapterView<?> parent, View view, int position, long id) {
android.util.Log.e(TAG,"POS: " + position);
}
...
}
...
#Override onResume(...) {
mListView.requestFocus();
}
...
public void setSelectedCh(int chId) { // request from Activity
mListView.setSelection(<private method to get pos from chId>);
}
...
class ChListAdapter extends ArrayAdapter<Stuff> {
public ChListAdapter() {
super(getActivity(), R.layout.row_ch, R.id.row_ch_name,<list in here>);
}
#Override
public View getView(int position, View convertView, ViewGroup parent) {
View row = super.getView(position, convertView, parent);
TextView txt1 = (TextView) row.findViewById(R.id.row_ch_name);
txt1.setText(...);
TextView txt2 = (TextView) row.findViewById(R.id.row_ch_number);
txt2.setText(...);
ImageView imgView = (ImageView) row.findViewById(R.id.row_ch_image);
imgView.setImageDrawable(logoBitmapDrawable);
return row;
}
}
...
}
FRAGMENT XML:
<LinearLayout...
<LinearLayout...
...
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_margin="10dp"
android:layout_weight="100"
android:baselineAligned="false"
android:orientation="vertical" >
<TextView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:paddingBottom="3dp"
android:paddingLeft="10dp"
android:paddingTop="3dp"
android:text="#string/asdf" />
<ListView
android:id="#+id/chListView"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:divider="#android:color/darker_gray"
android:dividerHeight="1dp" />
</LinearLayout>
...
</LinearLayout>
</LinearLayout>
LISTVIEW ROW XML (/layout/row_ch.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="match_parent"
android:orientation="horizontal" >
<ImageView
android:id="#+id/row_ch_image"
android:layout_width="50dp"
android:layout_height="50dp"
android:layout_gravity="center"
android:layout_marginBottom="10dp"
android:layout_marginLeft="10dp"
android:layout_marginTop="10dp"
android:src="#drawable/aaa" />
<TextView
android:id="#+id/row_ch_number"
android:layout_width="60dp"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:gravity="center"
android:text="bbb" />
<TextView
android:id="#+id/row_ch_name"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_marginLeft="2dp"
android:text="ccc" />
</LinearLayout>

How to get a textView value from ListView adapter onClick button inside same view?

I have a list View which contains imageView working as button and a TextView.
what I want is when I click on the button for example for the third item in the list view I want to get the text that in the textview when I click on the button which is in the same position as the text view..
I'll try with
final TextView txt= (TextView) findViewById(R.id.txt);
String txt2 = txt.getText().toString();
That's work more and less.
my problem it's so strange, I will try to explain with images
When I click on the button irrespective of the position, allways it return the textview which display on the fisrt position on the screen (not on listview, on screen)
for example
On that situation, (red square its screen) if I clicked on the button from the item 1,2 or 3 it return tv_1.
other example (again red square its screen)
Now, if I click on the button from the item 2,3 or 4 it return tv_2
that is, always it displays the top of the list of visible item on screen
My code
public void btn(View view)
{
final TextView tv_id = (TextView) findViewById(R.id.tv_id);
String txt = tv_id.getText().toString();
Log.i(LOGTAG, "" + txt);
}
Any suggestions?
UPDATE
The problem its because I need to use final variable to get only that textview, then its report first one item is displayed on screen, but... why? or how to solve?
UPDATE 2 MY XML
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:weightSum="1"
android:layout_marginLeft="26dp"
android:layout_marginTop="26dp"
android:layout_marginRight="26dp"
android:id="#+id/lay_fondo">
<FrameLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:background="#drawable/cardview_notify"
>
<LinearLayout
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<LinearLayout
android:orientation="horizontal"
android:layout_width="90dp"
android:layout_height="match_parent"
android:background="#color/primary_green"
android:id="#+id/lay_prioridad"
android:layout_marginLeft="5dp"
android:layout_marginTop="5dp"
android:layout_marginBottom="5dp">
</LinearLayout>
<LinearLayout
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<LinearLayout
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<LinearLayout
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:weightSum="1">
<LinearLayout
android:orientation="vertical"
android:layout_width="580dp"
android:layout_height="match_parent"
android:layout_weight="0.54">
<LinearLayout
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="id"
android:id="#+id/tv_id"
android:layout_gravity="center_vertical"
android:textColor="#color/black"
android:textSize="30sp"
android:layout_marginTop="10dp"
android:layout_marginLeft="26dp"/>
</LinearLayout>
</LinearLayout>
</LinearLayout>
<LinearLayout
android:orientation="horizontal"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<ImageView
android:layout_width="30dp"
android:layout_height="30dp"
android:id="#+id/img_favorito"
android:src="#drawable/star"
android:layout_marginTop="40dp"
android:layout_marginRight="20dp"
android:layout_onClick="btn"/>
</LinearLayout>
</LinearLayout>
</LinearLayout>
</LinearLayout>
</LinearLayout>
</FrameLayout>
</LinearLayout>
</FrameLayout>
Try to replace the below line
final TextView tv_id = (TextView) findViewById(R.id.tv_id);
with
TextView tv_id = (TextView) ((View) view.getParent()).findViewById(R.id.tv_id);
The above line finds textview with in the given view,
OR
Add an OnItemClickListener() for and list view
listView.setOnItemClickListener(new AdapterView.OnItemClickListener() {
#Override
public void onItemClick(AdapterView<?> parent, View view, int position, long id) {
final TextView tv_id = (TextView) view.findViewById(R.id.tv_id);
String txt = tv_id.getText().toString();
Log.i(LOGTAG, "" + txt);
}
});
Try to set onItemClickListener to your listView
listView.setOnItemClickListener(new AdapterView.OnItemClickListener() {
#Override
public void onItemClick(AdapterView<?> parent, View view, int position, long id) {
final TextView txt= (TextView) view.findViewById(R.id.txt);
String txt2 = txt.getText().toString();
Log.i(LOGTAG, "" + txt2);
}
});
OR
Set click listener for TextView inside your
getView(int position, View convertView, ViewGroup parent)
my suggestions;
tv_id is referencing only one item (R.if.tv_id). for this matter wherever you put your button, it will always call the code handled by tv_id.
I suggest you reference the list view and setonclicklistener on the listView.
ListView listView1 = (ListView) findViewById(R.id.listView1);
listView1.setOnItemClickListener(new OnItemClickListener() {
#Override
public void onItemClick(AdapterView<?> parent, View view,
int position, long id)
{
String item = ((TextView)view).getText().toString();
Toast.makeText(getBaseContext(), item, Toast.LENGTH_LONG).show();
}
Why do you want to get the text in so complicated way?
I assume you have your custom ListView adapter (e.g. MyAdapter) and your items (e.g. MyItem) with a getter (e.g. MyItem :: getText(), don't mind C++ style).
Then your approach could be:
listView.setOnItemClickListener(new AdapterView.OnItemClickListener() {
#Override
public void onItemClick(AdapterView<?> parent, View view, int position, long id) {
// Probably this check is not that necessary but better safe than sorry
if (listView.getAdapter() instanceof MyAdapter) {
MyAdapter adapter = (MyAdapter)listView.getAdapter();
String text = adapter.getItem(position).getText();
// Do whatever you need with the text
}
}
});

Android ListView not detecting selection

I'm stumped. This one IS simple and I'm missing something simple but I'm just not getting anywhere.
I have a ListView that contains pretty simple items - TextView's that contain text of the form "N. name", where N is the position in the list and name is the name of the associated objects. I've created a ListAdapter that presents that information into the ListView.
The presentation stuff seems to work fine. It's the part where when I tap on a row that's not working. I just don't get a notification. If I set a onClickListener on the item (when it's generated in the Adapter) I do get a notification, but it's convoluted to make that work the way I'd like it to. I've tried a bunch of stuff - changing descendent focusability, enabling, disabling, setting itemsCanFocus to false, ... - but no luck on any of them.
I've included relevant code for configuring the view and the elements in the ListView.
In particular, what I'm trying to do is get that OnItemClickLister.onItemClick() to get invoked when I tap on a row. Any thoughts on what I'm doing wrong?
Activity:
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
model = FZMModel.getInstance(this);
setContentView(R.layout.activity_deploy);
TextView viewTitle = (TextView) findViewById(R.id.deploy_header);
if (model.getProfiles().size() == 0) {
viewTitle.setText(R.string.deploy_header_create);
} else {
viewTitle.setText(R.string.deploy_header_choose);
}
profileListView = (ListView) findViewById(R.id.profileListView);
profileListAdapter = new ProfileListAdapter(this, model);
profileListView.setAdapter(profileListAdapter);
profileListView.setOnItemClickListener(new AdapterView.OnItemClickListener() {
#Override
public void onItemClick(AdapterView<?> adapterView, View view, int position, long id) {
Log.d(TAG, String.format("Item %d selected (with id=0x%x)", position, id));
}
});
}
Adapter:
... relevant code from getView():
#Override
public View getView(int position, View convertView, ViewGroup parent) {
final Profile profile = model.getProfileAtIndex(position);
final int rowNum = position;
if (convertView == null) {
LayoutInflater layoutInflater = (LayoutInflater) context.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
convertView = layoutInflater.inflate(R.layout.profile_list_layout, parent, false);
}
TextView profileIndexView;
TextView profileNameView;
profileIndexView = (TextView) convertView.findViewById(R.id.profileIndexLabel);
profileNameView = (TextView) convertView.findViewById(R.id.profileNameLabel);
profileIndexView.setText(String.format("%d.", position));
profileNameView.setText(profile.getName());
// convertView.setOnClickListener(new View.OnClickListener() {
// #Override
// public void onClick(View view) {
// Toast.makeText(context, String.format("Did select row #%d (index=%d)",rowNum, profile.getPosition()), Toast.LENGTH_SHORT).show();
// }
// });
return convertView;
}
activity layout:
<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="com.nsn.flexizonemobile.FZMConcreteActionDeploy"
tools:ignore="MergeRootFrame" >
<TextView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceLarge"
android:text="#string/deploy_header_choose"
android:id="#+id/deploy_header"
android:layout_margin="10dp"
android:layout_centerHorizontal="true" />
<ListView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/profileListView"
android:layout_gravity="left|top"
android:layout_alignParentLeft="true"
android:layout_marginLeft="0dp"
android:choiceMode="none"
android:layout_below="#+id/deploy_header"
android:divider="#android:color/darker_gray"
android:dividerHeight="2dp"
android:clickable="true"
android:descendantFocusability="beforeDescendants" />
</RelativeLayout>
profile_list_layout layout:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="horizontal" android:layout_width="match_parent"
android:layout_height="wrap_content">
<TextView
android:layout_width="#dimen/profile_index_width"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceMedium"
android:text="A. "
android:id="#+id/profileIndexLabel"
android:gravity="center_vertical|right"
android:layout_centerVertical="true"
android:paddingTop="5dp"
android:paddingBottom="5dp"
android:textSize="24sp"
android:textIsSelectable="true"
android:layout_alignParentStart="false"
android:layout_alignParentTop="true" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceMedium"
android:text="Profile Name"
android:id="#+id/profileNameLabel"
android:layout_alignParentLeft="false"
android:layout_alignParentTop="false"
android:gravity="center_vertical"
android:layout_toRightOf="#+id/profileIndexLabel"
android:layout_marginLeft="10dp"
android:layout_centerVertical="true"
android:textSize="24sp"
android:paddingTop="10dp"
android:paddingBottom="10dp" />
</RelativeLayout>
in the textview of your inflator layout just add:
android:focusable="false"
android:focusableInTouchMode="false"
and in parent layout of your inflator i.e in relative layout of inflator add:
android:descendantFocusability="blocksDescendants"
remove :
android:descendantFocusability="beforeDescendants"
from your listview. and set height of your listview to match_parent will solve your issue.
remove following attributes from your ListView:
android:choiceMode="none"
android:clickable="true"
android:descendantFocusability="beforeDescendants"
also
android:layout_width="wrap_content"
android:layout_height="wrap_content"
makes no sense in this context (especially height)

Android + Use ViewFlipper to flip individual items within a ListView?

This is probably a stupid question.
I know I can wrap a ListView in ViewFlipper, but can we wrap individual ListView Items in a ViewFlipper? For instance, the latest Twitter app uses a ListView to display Tweets. It also allows you to set settings on individual items by sliding the tweet out of the way exposing the setting option icons below. Is this a custom implementation or do we have the ability to create something similar using ListView and ViewFlipper? Thanks, any advice is appreciated!
I've spent some time on this and got the ListView to display additional content via the ViewFlipper. However, the view only seems to "flip" on the last item in the ListView. How do I get each item to flip when clicked? Here's some code:
row.xml
<?xml version="1.0" encoding="utf-8"?>
<ViewFlipper xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/flipper" android:layout_width="fill_parent"
android:layout_height="fill_parent">
<TextView android:id="#+id/toptext" android:layout_width="fill_parent"
android:layout_height="0dip" android:layout_weight="1"
android:gravity="center_vertical" />
<TextView android:id="#+id/bottomtext" android:layout_width="fill_parent"
android:layout_height="0dip" android:layout_weight="1"
android:gravity="center_vertical" />
</ViewFlipper>
main.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical" android:layout_width="fill_parent"
android:layout_height="fill_parent">
<ListView android:id="#id/android:list" android:layout_width="fill_parent"
android:layout_height="fill_parent" />
</LinearLayout>
ListActivityView.java - extends ListActivity
...
#Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
...
}
#Override
protected void onListItemClick(ListView l, View v, int position, long id) {
super.onListItemClick(l, v, position, id);
// doesn't matter which line is clicked
// only the last item in the ListView displays the bottomText
viewFlipper.showNext();
}
ListingAdapter.java - extends ArrayAdapter
#Override
public View getView(int position, View convertView, ViewGroup parent) {
View v = convertView;
if (v == null) {
LayoutInflater vi = (LayoutInflater)getSystemService(Context.LAYOUT_INFLATER_SERVICE);
v = vi.inflate(R.layout.row, null);
viewFlipper = (ViewFlipper) v.findViewById(R.id.flipper);
}
If I am getting your question correct - you can use ViewFlipper inside a layout that defines a row in your list and init it the way you like when rendering corresponding view
Below code helps you achieve a requirement for having a view flipper in list view with invidual row flipping
## xml file ##
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/regularLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:padding="#dimen/activity_horizontal_margin">
<ViewFlipper
android:id="#+id/row_item_flipper"
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:layout_width="match_parent"
android:orientation="vertical"
android:layout_height="match_parent">
<TextView
android:id="#+id/list_item"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Regular Layout"
android:textSize="28sp" />
<Button
android:text="Flip"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/front_button" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:orientation="vertical"
android:layout_height="match_parent">
<TextView
android:id="#+id/backTextView"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Flip row done"
android:textSize="18sp" />
<Button
android:text="Flip back"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/back_button" />
</LinearLayout>
</ViewFlipper>
</LinearLayout>
----------
## Java code ##
#Override
public ItemViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
View itemView = LayoutInflater.from(parent.getContext()).inflate(R.layout.row_item, parent, false);
return new ItemViewHolder(itemView);
}
#Override
public void onBindViewHolder(final ItemViewHolder holder, int position) {
final CustomItem data = dataList.get(position);
holder.regularLayout.setVisibility(View.VISIBLE);
holder.swipeLayout.setVisibility(View.GONE);
holder.listItem.setText(data.dataItemValue );
holder.backTextView.setText(data.dataItemValue + " position : "+ position);
holder.viewFlipper.setFlipInterval(0);
holder.viewFlipper.setInAnimation(null);
holder.viewFlipper.setOutAnimation(null);
if(holder.viewFlipper.getDisplayedChild()==0 && data.isFlipON){
holder.viewFlipper.setDisplayedChild(1);
} else if(holder.viewFlipper.getDisplayedChild()==1 && !data.isFlipON){
holder.viewFlipper.setDisplayedChild(0);
}else if(data.isFlipON){
holder.viewFlipper.setDisplayedChild(1);
}else{
holder.viewFlipper.setDisplayedChild(0);
}
holder.frontButton.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View v) {
AnimationFactory.flipTransition(holder.viewFlipper, AnimationFactory.FlipDirection.LEFT_RIGHT);
data.isFlipON = true;
}
});
holder.backButton.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View v) {
data.isFlipON = false;
AnimationFactory.flipTransition(holder.viewFlipper, AnimationFactory.FlipDirection.LEFT_RIGHT);
}
});
}

Can't click on ListView whose rows are made of WebViews

I have an Activity which extends ListView
The ListView that I use is an extension of ArrayAdapter and each row of the ListView primarily consists of a WebView
The problem is that touching the WebView does not call OnListItemClick.
Any thoughts on how I can be able to touch the webview and call OnListItemClick?
Or is there something else that I'm doing wrong?
Thanks!
Here is a skeleton of the Activity class, along with the relevant XML files for the layout
PS, I've tried setting android:clickable="false" in my layout, but this doesn't let me click on the rows of my ListView.
Interestingly, I can still scroll through the list, but I just can't click!
public class ListOfItemsFromTopicActivity extends ListActivity {
private Topic t;
#Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.items_from_topic_skeleton);
TopicFactory tf = new TopicFactory();
t = tf.build_topic(3);
ListView itemlist = getListView();
ListOfItemsAdapter adapter = new ListOfItemsAdapter(this, R.layout.items_from_topic_row, t.getItems());
itemlist.setAdapter(adapter);
}
protected void onListItemClick(ListView l, View v, int position, long id) {
super.onListItemClick(l, v, position, id);
// do some stuff that never gets done
}
private class ListOfItemsAdapter extends ArrayAdapter<Item> {
private ArrayList<Item> items;
private int text_view_resource_id;
private LayoutInflater layout_inflater = (LayoutInflater)getSystemService(Context.LAYOUT_INFLATER_SERVICE);
public ListOfItemsAdapter(Context context, int a_text_view_resource_id, ArrayList<Item> some_items) {
super(context, a_text_view_resource_id, some_items);
this.items = some_items;
this.text_view_resource_id = a_text_view_resource_id;
}
#Override
public View getView(int position, View convertView, ViewGroup parent) {
View v = layout_inflater.inflate(this.text_view_resource_id, null);
Item o = items.get(position);
WebView page = (WebView)v.findViewById(R.id.item);
page.loadDataWithBaseURL("fake://a/bcde", o.getShort_title(), "text/html", "utf-8", "");
return v;
}
}
}
items_from_topic_skeleton.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_height="fill_parent"
android:layout_width="fill_parent"
android:orientation="vertical"
>
<TextView
android:background="#drawable/blackgrad"
android:gravity="center"
android:id="#+id/section_title"
android:layout_height="50dip"
android:layout_width="fill_parent"
android:textColor="#ffffff"
android:textSize="18sp"
/>
<ListView
android:background="#ffffff"
android:cacheColorHint="#ffffffff"
android:id="#android:id/list"
android:layout_height="fill_parent"
android:layout_width="fill_parent"
/>
</LinearLayout>
items_from_topic_row.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:padding="5dip"
>
<LinearLayout
android:gravity="center"
android:layout_height="60dip"
android:layout_width="fill_parent"
android:orientation="horizontal"
>
<LinearLayout
android:layout_height="fill_parent"
android:layout_weight="1"
android:layout_width="fill_parent"
android:minHeight="55dip"
android:orientation="horizontal"
android:padding="5dip"
>
<WebView
android:id="#+id/item"
android:layout_height="fill_parent"
android:layout_width="fill_parent"
android:scrollbars="none"
/>
</LinearLayout>
<ImageView
android:id="#+id/disclosure"
android:layout_height="29dip"
android:layout_width="29dip"
android:paddingRight="5dip"
android:src="#drawable/disclosure"
/>
</LinearLayout>
</LinearLayout>
If you add a focusable element to a ListView, it causes the ListView items to no longer be selectable. Try setting android:clickable = false on your WebView.
Just make your onTouch event to do whatever you want.
e.g: My list item consists of TextView, WebView and Linear layout:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="66dp"
android:orientation="vertical"
android:id="#+id/layout">
<TextView
android:layout_width="wrap_content"
android:id="#+id/textView"
android:layout_height="wrap_content" />
<WebView
android:id="#+id/webvie"
android:layout_width="match_parent"
android:layout_height="wrap_content">
</WebView>
</LinearLayout>
and I want to perform on click action - on the whole listitem.
holder.layout.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View view) {
//do stuff
}
});
But when I run my app, only texview is clickable. What to do? Set up onTouch listener on webView:
holder.webView.setOnTouchListener(new View.OnTouchListener() {
#Override
public boolean onTouch(View v, MotionEvent event) {
holder.layout.callOnClick();
return true;
}
});
supports only API 15+ tough...

Categories

Resources