Android : Locating the item at center position of the screen after selecting it ,In the horizontalscrollview

Question

I am trying to scroll item to the middle position of the screen after selecting it.I have used Horizontalscrollview and LinearLayout inside it to add item. I show in the XML

XML

<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"
    android:orientation="vertical"
    tools:context=".MainActivity" >

  <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_above="@+id/bottom"
        android:orientation="vertical" >

       <HorizontalScrollView
                android:id="@+id/scrollView"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_below="@+id/updown"
                android:layout_weight="0.8"
                android:fadingEdgeLength="0dp" >

                <LinearLayout
                    android:id="@+id/horizontalbar"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:background="@color/tlbackground"
                    android:baselineAligned="true"
                    android:orientation="horizontal" >
                </LinearLayout>
       </HorizontalScrollView>
  </LinearLayout>
</RelativeLayout>

Class

public class MainActivity extends FragmentActivity implements ActionBar.TabListener
{

    @Override
    protected void onCreate(Bundle savedInstanceState) 
    {
      super.onCreate(savedInstanceState);
      setContentView(R.layout.activity_main);
      hsl = (HorizontalScrollView) findViewById(R.id.scrollView);
      LinearLayout l1 = (LinearLayout)findViewById(R.id.horizontalbar);

        for(int i = 0; i < 20; i++)
        {
            Button b = new Button(this);
            b.setText("t"+i);
            ll.addView(b);
        }
     }
}

I want something like in figure

before click

after click

How can I Scroll that selected item to the middle in HorizontalScrollview?

Solution 1

After long try , I have got it with this

for (int i = 0; i < 20; i++) {
    final Button b = new Button(this);
    b.setText("t" + i);
    b.setOnClickListener(new OnClickListener() {

    @Override
    public void onClick(View v) {
       int scrollX = (b.getLeft() - (screenWidth / 2)) + (b.getWidth() / 2);
       hsl.smoothScrollTo(scrollX, 0);
    }
});

ll.addView(b);
}

Solution 2

This is how your onCreate should look like:

hsl = (HorizontalScrollView) findViewById(R.id.scrollView);
LinearLayout ll = (LinearLayout) findViewById(R.id.horizontalbar);

Display display = getWindowManager().getDefaultDisplay();
Point size = new Point();
display.getSize(size);
final int width = size.x;

for (int i = 0; i < 20; i++) {
    final Button b = new Button(this);
    b.setText("t" + i);
    b.setOnClickListener(new OnClickListener() {

        @Override
        public void onClick(View v) {
            int center = (width - b.getWidth())/2;
            hsl.scrollTo(b.getLeft() - center, b.getTop());
        }
    });

    ll.addView(b);
}

The only thing i didn't discover is why i need to substract additional 200px (in my case). Probably some padding or something else. Instead of 200, you could discover how many dips is it and call function:

public static int convertDipToPixels(Context c, float dips) {
    return (int) (dips * c.getResources().getDisplayMetrics().density + 0.5f);
}