Databases
StackOverflow2013
Postsdbo
PO
Body
 

Note that there are some explanatory texts on larger screens.

plurals
  1. PO
    text
    copied!<p>I thought a new answer would be a good idea since the old one is so different. </p> <p>I'll start with a bit of background: The idea here is to use a horizontal scroll view to move to the next set of controls in a pretty way. So when the user stop scrolling the scroll view to the left or right, we want to change the pictures and text, and then move the scroll back to the middle in preparation for the next swipe. Someone has already answered how to listen for when a scroll view stops I've included an almost working example of how you might use this to get the effect you are looking for. </p> <p>I hope this helps out and feel free to ask if you have anymore problems. </p> <pre><code> @Override protected void onScrollChanged(int x, int y, int oldX, int oldY) { if (Math.abs(y - oldY) &gt; SlowDownThreshold) { currentlyScrolling = true; } else { currentlyScrolling = false; if (!currentlyTouching) { //scrolling stopped...handle here //Check if it was a left or right swipe by comparing the new and old scroll locations if (y &gt; oldY) { //Scroll moved Right //So we would do something like setContents(Index + 1); //We find out where the middle of the scroll is int middleHScroll = (Hscrollview.getMeasuredWidth() / 2) - (Hscrollview.getMeasuredWidth() / 2) //We then return the scroll view to the middle HScroll.scrollTo(middleHScroll); } else { //Scroll moved Left //We get set the pictures and text to the previous Index of the contents setContents(Index - 1); //We find out where the middle of the scroll is int middleHScroll = (Hscrollview.getMeasuredWidth() / 2) - (Hscrollview.getMeasuredWidth() / 2) //We then return the scroll view to the middle HScroll.scrollTo(middleHScroll); } super.onScrollChanged(x, y, oldX, oldY); } } } </code></pre> <p>The xml should be something along these lines. There is still plenty of work to do to get this working but I hope this puts you in the right direction. </p> <pre><code> &lt;LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="fill_parent" android:layout_height="fill_parent" android:orientation="vertical" &gt; &lt;TextView android:id="@+id/textview1" android:layout_width="fill_parent" android:layout_height="wrap_content" android:background="@drawable/title_bar" android:gravity="center_horizontal" android:text="PRODUCTS &gt;&gt; PRODUCT DETAILS" /&gt; &lt;RelativeLayout android:layout_width="fill_parent" android:layout_height="wrap_content" &gt; &lt;RelativeLayout android:id="@+id/RelativeLayout1" android:layout_width="fill_parent" android:layout_height="fill_parent" android:orientation="vertical" android:weightSum="2" &gt; &lt;HorizontalScrollView xmlns:android="http://schemas.android.com/apk/res/android" android:id="@+id/HorizontalScrollView1" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_alignParentLeft="true" android:layout_alignParentTop="true" &gt; &lt;LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_marginRight="70dp" android:orientation="horizontal" &gt; &lt;ImageView android:id="@+id/productimage3" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_marginLeft="70dp" android:layout_marginRight="20dp" android:layout_weight="1" android:background="@drawable/product_detail_gradient" android:minHeight="100dp" android:minWidth="100dp" /&gt; &lt;ImageView android:id="@+id/productimage2" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_marginLeft="70dp" android:layout_marginRight="70dp" android:layout_weight="1" android:background="@drawable/product_detail_gradient" android:minHeight="100dp" android:minWidth="100dp" /&gt; &lt;ImageView android:id="@+id/productimage1" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_marginLeft="70dp" android:layout_marginRight="70dp" android:layout_weight="1" android:background="@drawable/product_detail_gradient" android:minHeight="100dp" android:minWidth="100dp" /&gt; &lt;/LinearLayout&gt; &lt;/HorizontalScrollView&gt; &lt;RelativeLayout android:id="@+id/description" android:layout_width="fill_parent" android:layout_height="fill_parent" android:layout_alignParentBottom="true" android:layout_alignParentLeft="true" android:layout_below="@+id/HorizontalScrollView1" android:layout_weight="1" android:background="@drawable/black_img_bg" &gt; &lt;TextView android:id="@+id/title" android:layout_width="wrap_content" android:layout_height="wrap_content" android:textSize="15dip" android:textStyle="bold" &gt; &lt;/TextView&gt; &lt;TextView android:id="@+id/desc" android:layout_width="fill_parent" android:layout_height="wrap_content" android:layout_below="@+id/title" &gt; &lt;/TextView&gt; &lt;Button android:id="@+id/addtocart" android:layout_width="80dip" android:layout_height="wrap_content" android:layout_alignParentBottom="true" android:layout_alignParentLeft="true" android:background="@drawable/button_green_lhs" android:gravity="left|center_vertical" android:onClick="addToCartOrBuy" android:text="Add To Cart" android:textSize="10dip" /&gt; &lt;Button android:id="@+id/buy" android:layout_width="150dip" android:layout_height="wrap_content" android:layout_alignParentBottom="true" android:layout_toRightOf="@+id/addtocart" android:background="@drawable/button_orange_mid" android:onClick="addToCartOrBuy" android:text="Buy" android:textSize="10dip" /&gt; &lt;Button android:id="@+id/tellafriend" android:layout_width="80dip" android:layout_height="wrap_content" android:layout_alignParentBottom="true" android:layout_alignParentRight="true" android:layout_toRightOf="@+id/buy" android:background="@drawable/button_green_rhs" android:gravity="right|center_vertical" android:onClick="tellAFriend" android:text="Tell A Friend" android:textSize="10dip" /&gt; &lt;/RelativeLayout&gt; &lt;/RelativeLayout&gt; &lt;/RelativeLayout&gt; &lt;/LinearLayout&gt; </code></pre>
 

Querying!

 
Guidance
An individual column

Larger individual text columns get their own page to allow for proper reading.

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