Android Center Locked HorizontalScrollView

Contents

12th October, 2022

HorizontalScrollView is used to scroll the child views or elements in horizontal direction. In this example you will learn how to create center locked HorizontalScrollView.

Step 1: Create New Project

Create a new project in Android Studio from File ⇒ New Project and select Empty Activity from the templates.

Step 2: Add HorizontalScrollView in Activity Layout

Open related layout file and add HorizontalScrollView in it.

<?xml version="1.0" encoding="utf-8"?>
<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">

    <HorizontalScrollView
        android:id="@+id/horizontalScrollView"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="#007b12">

        <LinearLayout
            android:id="@+id/container"
            android:layout_width="wrap_content"
            android:layout_height="match_parent"
            android:orientation="horizontal" />
    </HorizontalScrollView>
    <TextView
        android:text="CodestringZ"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerVertical="true"
        android:layout_centerHorizontal="true"
        android:id="@+id/testTextView"/>
</RelativeLayout>

Step 3: Adjust Your Activity

Adjust your activity to use the HorizontalScrollView.

package com.codestringz.mytestapp;

import android.graphics.Color;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.util.DisplayMetrics;
import android.view.Gravity;
import android.view.View;
import android.view.ViewGroup;
import android.widget.HorizontalScrollView;
import android.widget.LinearLayout;
import android.widget.TextView;

import java.util.ArrayList;
import java.util.Collections;

public class MainActivity extends AppCompatActivity
{

    private HorizontalScrollView mHorizontalScrollView;
    private LinearLayout mContainer;
    private String mCities[] = new String[]
            {
                "London", "Bangkok", "Paris", "Dubai", "Istanbul", "New York",
                "Singapore", "Kuala Lumpur", "Hong Kong", "Tokyo", "Barcelona",
                "Vienna", "Los Angeles", "Prague", "Rome", "Seoul", "Mumbai", "Jakarta",
                "Berlin", "Beijing", "Moscow", "Taipei", "Dublin", "Vancouver"
            };
    private ArrayList mData = new ArrayList<>();
    private TextView mTestTextView;

    @Override
    protected void onCreate(Bundle savedInstanceState)
    {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        setUIRef();
        bindData();
        bindHZSWData();
    }

    private void setUIRef()
    {
        mHorizontalScrollView = findViewById(R.id.horizontalScrollView);
        mContainer = findViewById(R.id.container);
        mTestTextView = findViewById(R.id.testTextView);
    }

    private void bindHZSWData()
    {
		//dynamically creating child views for our HorizontalScrollView
		
        LinearLayout.LayoutParams layoutParams = new LinearLayout.LayoutParams(ViewGroup.LayoutParams.WRAP_CONTENT, ViewGroup.LayoutParams.WRAP_CONTENT);
        layoutParams.gravity = Gravity.CENTER;
        layoutParams.setMargins(20, 20, 20, 20);

        for (int i = 0; i < mData.size(); i++)
        {
            //creating textViews
            TextView textView = new TextView(this);
            textView.setText(mData.get(i));
            textView.setTextColor(Color.WHITE);
            textView.setLayoutParams(layoutParams);
            textView.setOnClickListener(new View.OnClickListener()
            {
                @Override
                public void onClick(View view)
                {
                    performItemClick(view);
                }
            });

            mContainer.addView(textView);
        }
        
		mContainer.invalidate();
    }

    private void performItemClick(View view)
    {
        //------Get Width of Display--------
        DisplayMetrics displayMetrics = new DisplayMetrics();
        getWindowManager().getDefaultDisplay().getMetrics(displayMetrics);

        int screenWidth = displayMetrics.widthPixels;

        int scrollX = (view.getLeft() - (screenWidth / 2)) + (view.getWidth() / 2);

        //Smooth scrolling horizontalScrollView
        mHorizontalScrollView.smoothScrollTo(scrollX, 0);

        String s = "Selected Item: " + ((TextView) view).getText();
        mTestTextView.setText(s);
    }

    private void bindData()
    {
        //add all cities to ArrayList
        Collections.addAll(mData, mCities);
    }
}