I have a VerticalViewPager whose Fragment content I want to scroll horizontally. The vertical paging works fine until the horizontal content is big enough to scroll. After that the touch events are not passed on to the ViewPager and so paging no longer works.
MVCE
This can be reproduced by setting up a simple project as given in this answer that I just posted.
Replace the fragment_one.xml file with
<?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="match_parent" >
<HorizontalScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_centerInParent="true" >
<TextView
android:id="#+id/textview"
android:textSize="30sp"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</HorizontalScrollView>
</RelativeLayout>
and set the text to anything long enough to scroll horizontally.
Things I've tried
NestedScrollView: That quickly turned out to be a dead end since it is apparently not available for horizontal scrolling. I thought about converting the source code to a HorizontalNextedScrollView but that would not be a trivial project.
Custom HorizontalScrollView: I tried converting answers like this and this for horizontal scrolling, but was unsuccessful. I'm going to continue experimenting in this area.
This is not a DoubleViewPager but I feel like the solution should be similar.
In order to answer this and other similar questions, it is very helpful to understand how the Android Framework handles touch events. My fuller answer on that is here, but I will include the summary diagram below.
The HorizontalScrollView (ViewGroup B in the diagram) is handling all touch events before the VerticalViewPager (ViewGroup A) has a chance to. So the solution is to use onInterceptTouchEvent() in the VerticalViewPager to selectively filter out vertical scrolls. For that it is easiest to just use a GestureDetector.SimpleOnGestureListener.onScroll().
Here are the relevant changes you need to make to the VerticalViewPager class to accomplish that:
public class VerticalViewPager extends ViewPager {
GestureDetector mDetector;
private void init() {
// ...
mDetector = new GestureDetector(getContext(), new VerticalScrollListener());
}
#Override
public boolean onInterceptTouchEvent(MotionEvent ev) {
super.onInterceptTouchEvent(flipXY(ev));
flipXY(ev);
return mDetector.onTouchEvent(ev);
}
class VerticalScrollListener extends GestureDetector.SimpleOnGestureListener {
#Override
public boolean onScroll(MotionEvent e1, MotionEvent e2,
float distanceX, float distanceY) {
return Math.abs(distanceY) > Math.abs(distanceX);
}
}
}
Related
I have a layout that contains a ListView and a few buttons in a RelativeLayout. I am trying to let the user draw on the page using a custom paint view layout. The good news is that I've got nearly everything working and looking how it should, however the last and most frustrating issue is that the ListView is no longer clickable at all. I would like to paint on top of the the ListView AND make it clickable.
The funny part is that the buttons on the page are still clickable, just the items in the ListView are not. I think what is happening is that the ListView is loaded by an adapter and gets loaded first (thus behind everything). What do I need to do in order to make the ListView clickable?
I've tried adding android:focusableInTouchMode="true" android:focusable="true" but it made no difference.
My layout is as follows:
<?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="match_parent"
android:background="#drawable/background"
android:orientation="vertical" >
<ListView android:id="#+id/lv"
android:layout_height="match_parent"
android:layout_width="match_parent"
></ListView>
<com.my.app.PaintView
android:id="#+id/paintView"
android:layout_width="match_parent"
android:layout_height="match_parent" />
<Button
Buttons Here.../>
</RelativeLayout>
The focusable attribute should be false for the element you do not want to receive touch events. To overlay your PaintView without having it intercept touch events, you can add a few XML attributes to it:
<com.my.app.PaintView
...
android:focusable="false"
android:clickable="false" />
As long as you don't set an OnClickListener or an OnTouchListener to your PaintView, touch events should simply pass through it to the Views behind it.
Managed to find a solution that works perfectly (at least for me). I imagine without the listview this would have been far easier, but I wanted the listview to work as well as drawing on the canvas. All I ended up having to do was set an onTouchListener in the main activity that had the ListView, then send it to the PaintView with the MotionEvent. Simple and it works perfectly:
listview.setOnTouchListener(new View.OnTouchListener() {
#Override
public boolean onTouch(View view, MotionEvent motionEvent) {
paintView.onTouchEvent(motionEvent);
return false;
}
});
In this example, the paintView.onTouchEvent could really be any method in the custom view, just kept it at "onTouchEvent" for simplicity.
I have a vertical ViewPager. Each page contains some elements which a NestedScrollView. If I swipe outside of the NestedScrollView it works perfectly, but if I swipe inside the NestedScrollView the vertical scroll of ViewPager doesn't work.
My Nested:
<android.support.v4.widget.NestedScrollView
android:id="#+id/scroll_view"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingTop="6dp"
android:paddingBottom="6dp"
android:clipToPadding="false"
android:overScrollMode="never">
And I set the setup like that too:
scrollView.setNestedScrollingEnabled(false);
Could you help me guys? Thank you very much!
Use requestDisallowInterceptTouchEvent so it will not allow child to intercept touch events.
yourViewPager.setOnTouchListener(new View.OnTouchListener() {
#Override
public boolean onTouch(View v, MotionEvent event) {
yourViewPager.getParent().requestDisallowInterceptTouchEvent(true);
return false;
}
});
For more reference this requestDisallowInterceptTouchEvent
Hello I have a ImageView(background) which's height should correspond to the screen height, the width on the other hand should be left intact.
Before this was done like this
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="wrap_content"
android:layout_height="match_parent">
<HorizontalScrollView
android:layout_width="wrap_content"
android:layout_height="match_parent">
<ImageView
android:id="#+id/songDetails_songImage"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:adjustViewBounds="true"
android:contentDescription="#string/songDetails_cd_songCover"
app:srcCompat="#drawable/default_song_cover" />
</HorizontalScrollView>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
...
This worked fine - the image view occupies whole background and the user can scroll right or left to see the whole image.
My goal is to animate the scroll, to do that I need to get rid of the horizontal view(to prevent user from scrolling) but whenever I change the HorizontalScrollView to Frame/Relative layouts(with the width set to wrap_content) the image view is scaled down to fit the screen.
Is there a way to keep the imageView width intact(with height matching that of the screen) so that it would remain bigger than the device screen?(without cropping)
I could then use custom animation to scroll right.
I have looked at similar questions but I wasn't able to find anything that would work in this case.
What you could do is to try to override the onTouchListener for the HorizontalScrollView.
For example, something like this:
scrollView.setOnTouchListener(new OnTouch());
private class OnTouch implements OnTouchListener
{
#Override
public boolean onTouch(View v, MotionEvent event) {
return true;
}
}
This would disable the user from scrolling the HorizontalScrollView while you could probably still scroll it programmatically.
I have two listViews in the same LinearLayout. Each listView looks like this:
<ListView
android:layout_width="fill_parent"
android:layout_height="0dp"
android:id="#+id/listViewReceived"
android:layout_weight="1"
>
</ListView>
<ListView ><!--same as above-->
The issue is that the two listViews have a scrollbar but I want show all the items without a scrollbar.
if I make scrolling in anyone the listviews the movement is generated internally. but I want show scrollbar in entire the screen. how the green bar. https://drive.google.com/file/d/0B_Z2NZi-dbUMc3FCOTQ1UDNWRnM/view
issue is that the two listView have your scrollbar but I want show all the items without scrollbar.
Add this to all of the listview
android:scrollbars="none"
android:scrollbars=none will define which scrollbars to display or show any at all. This won’t disable scrolling as such (you’ll be able to scroll in the appropriate direction) but just hide the scrollbars from the user interface. Try Following Code
listView.setOnTouchListener(new OnTouchListener() {
public boolean onTouch(View v, MotionEvent event) {
if (event.getAction() == MotionEvent.ACTION_MOVE) {
return true; // Indicates that this has been handled by you and will not be forwarded further.
}
return false;
}
});
I have to add pull-to-refresh functionality to refresh info on main screen. Here`s a scheme of my screen UI (red area should handle pulling):
I use ready solution for pull-to-refresh. Due to documentation, my red layout should be one of these classes:
ListView
ExpandableListView
GridView
WebView
ScrollView
HorizontalScrollView
ViewPager
But I have ListView on my screen, so I am not able to use ScrollView as red layout. And I`m stuck with this problem. It is possible to use UITableView into UIScrollView in iOS, but in Android one I have no idea what to do in such cases.
Any help will be appreciated. Thanks!
Why not replace the listview by a LinearLayout and then you can use the ScrollView?
You just need to create a layout for the items in the linearlayout and then adding them using something like this:
LinearLayout layout = (LinearLayout)findViewById(R.id.MyListLayout);
for (int i=0; i<list.size(); i++) {
Item item = list.get(i);
View view = inflater.inflate(R.layout.MyRowLayout, null);
Textview myTextView = view.findViewById(R.id.MyTextView);
myTextView.setText(item.getString());
list.addView(vi);
}
Is the pull-to-refresh horizontal or vertical?
In case it's horizontal, use a HorizontalScrollView (a ViewPager would do, too), and then place a Table?Layout inside it.
In case it's horizontal, well, I don't think I like that design (the pull-to-refresh area should just be the ListView), but I believe there is some way to use the ListView without its internal scrolling so that you can rely on a parent ScrollView to do the scrolling, but I'd need to check the code of an old problem to "remember" how to do that.
I've solved this issue, but forgot to write about it :)
My layout.xml file looks like this:
<com.handmark.pulltorefresh.library.PullToRefreshScrollView
android:id="#+id/home_info_pulltorefresh"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fillViewport="true" >
<LinearLayout
android:id="#+id/home_info_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#color/white_background"
android:baselineAligned="false"
android:orientation="horizontal" >
<LinearLayout
android:id="#+id/charts_container"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="2"
android:orientation="vertical"
android:paddingRight="5dp" >
<FrameLayout
android:id="#+id/frame_container_chart_top"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1" />
<FrameLayout
android:id="#+id/frame_container_chart_bottom"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1" />
</LinearLayout>
<FrameLayout
android:id="#+id/frame_container_right"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1" />
</LinearLayout>
</com.handmark.pulltorefresh.library.PullToRefreshScrollView>
android:fillViewport="true" is used to stretch its content to fill the viewport (make height of scroll match_parent)
I add Fragment containing ListView programmatically (R.layout.frame_container_right Fragment resource ID)
Everything worked fine, but when I tried to scroll ListView down, my ScrollView began to scroll. Scrolling ListView up worked fine. Also I noticed that if I tap ListView, move finger left or right and then try to scroll down, touch events are not transmitted from ListView to ScrollView and I get expected behavior. So I've decided to emulate this situation programmatically:
mListViewReviews.setOnTouchListener(new OnTouchListener() {
#Override
public boolean onTouch(View v, MotionEvent event) {
if (event.getAction() == MotionEvent.ACTION_DOWN) {
long startTime = SystemClock.uptimeMillis();
long duration = 1;
MotionEvent e = MotionEvent.obtain(startTime, startTime + duration, MotionEvent.ACTION_MOVE, event
.getX(), event.getY() + 10, 0);
MotionEvent ev = MotionEvent.obtain(startTime + duration, startTime + duration * 2,
MotionEvent.ACTION_MOVE, event.getX(), event.getY() + 20, 0);
v.dispatchTouchEvent(e);
v.dispatchTouchEvent(ev);
}
return false;
}
});
As a result, I've got working ListView with proper cell reuse and working pull-to-refresh logic. Thanks!