Databases
StackOverflow2013
Postsdbo
POHandling click events in ViewPager with negative page margin
 

Note that there are some explanatory texts on larger screens.

plurals
  1. POHandling click events in ViewPager with negative page margin
    primarykey
    data
    text
    <p><img src="https://i.stack.imgur.com/Fhh57.png" alt="enter image description here"></p> <p>I have a ViewPager showing "cards" that the user can swipe between. The cards are created in their own fragments (so I am using a FragmentStatePagerAdapter to create the content for the ViewPager). </p> <p>I wanted to show the edge of the next and possibly previous cards, so as recommended on this site I set the pageMargin of the ViewPager to a negative number. This works well and looks just as I want it to. </p> <p>My problem is that I need to respond to click events on the cards. But using a negative pageMargin causes the pages to overlap, sometimes resulting in the wrong page receiving the click event. How can I make sure the click events are received by the correct card? Basically what I want is that only the current/selected page will receive click events. </p> <p>From my main fragment containing the viewPager:</p> <pre><code>@Override public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) { ViewGroup root = (ViewGroup) inflater.inflate(R.layout.fragment_cards_overview, null); mCardsViewPager = (ViewPager) root.findViewById(R.id.cards_viewpager); mPagerAdapter = new MyPagerAdapter(getActivity(), getFragmentManager(), mCardsList); mCardsViewPager.setAdapter(mPagerAdapter); mCardsViewPager.setOnPageChangeListener(mPagerAdapter); // Necessary or the pager will only have one extra page to show // make this at least however many pages you can see mCardsViewPager.setOffscreenPageLimit(3); // Set margin for pages as a negative number, so a part of next and // previous pages will be showed (convert desired dp to pixels) DisplayMetrics m = getResources().getDisplayMetrics(); int pagerWidthPx = (int) getResources().getDimension(R.dimen.card_width); int screenWidthPx = m.widthPixels; int px = (int) ((screenWidthPx - pagerWidthPx) * 1.6); mCardsViewPager.setPageMargin(-px); return root; } </code></pre> <p>Layout of the card:</p> <pre><code>&lt;RelativeLayout android:id="@+id/card_content" android:layout_width="@dimen/card_width" android:layout_height="@dimen/card_height" android:background="@drawable/card_background" &gt; &lt;ImageView android:id="@+id/card_logo" android:layout_width="50dp" android:layout_height="35dp" android:layout_margin="8dp" android:contentDescription="@string/app_name" android:scaleType="fitStart" android:src="@drawable/card_logo" /&gt; &lt;Button android:id="@+id/card_remove_button" android:layout_width="32dp" android:layout_height="32dp" android:layout_margin="3dp" android:layout_alignParentRight="true" android:layout_alignParentTop="true" android:background="@drawable/btn_close" /&gt; &lt;TextView android:id="@+id/card_label" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_alignParentLeft="true" android:layout_below="@id/card_logo" android:layout_centerVertical="true" android:layout_margin="8dp" android:textSize="20sp" /&gt; &lt;/RelativeLayout&gt; </code></pre> <p>dimens.xml:</p> <pre><code>&lt;dimen name="card_width"&gt;300dp&lt;/dimen&gt; &lt;dimen name="card_height"&gt;200dp&lt;/dimen&gt; </code></pre>
    singulars
    1. PO
      singulars
      1. PTAnswer
    1. This table or related slice is empty.
    1. PTQuestion
    1. USGober
    1. USGober
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. PO
      singulars
      1. PTAnswer
    1. VO
      singulars
      1. POHandling click events in ViewPager with negative page margin
      1. USGober
      1. VTFavorite
    2. VO
      singulars
      1. POHandling click events in ViewPager with negative page margin
      1. This table or related slice is empty.
      1. VTUpMod
    3. VO
      singulars
      1. POHandling click events in ViewPager with negative page margin
      1. USLaurence Fan
      1. VTFavorite
    1. This table or related slice is empty.
 

Querying!

 
Guidance
A row detail

Detail views are divided into sections. All the information in the data section comes from columns in the selected row. The other sections display data from other, related rows.

Related data can be related in a to-one or a to-many fashion. Captions of data related in a to-many fashion link to a list view showing a filtered view of the table.

Try moving around until you find a non-empty to-many entry and click on the label to get to one. You can move back to the root by clicking on the database name in the header.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload