Pages

Saturday, September 8, 2012

Android Horizontal Scroll View Example



create your xml file


<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
  xmlns:android="http://schemas.android.com/apk/res/android"
  android:orientation="vertical"
android:layout_height="fill_parent"
android:layout_width="wrap_content">
  <ImageView
android:id="@+id/IVDisplay"
  android:layout_width="200dp"
  android:layout_height="200dp"
  android:src="@drawable/opel"
  android:layout_marginRight="20dp"
android:layout_marginLeft="40dp"></ImageView>
   <Button
android:text="Choose"
   android:id="@+id/bChoose"
   android:layout_width="fill_parent"
  android:layout_height="wrap_content"
android:layout_marginLeft="40dp"></Button>

  <HorizontalScrollView
    android:layout_width="200dp"
  android:layout_height="wrap_content"
  android:layout_gravity="center">

  <LinearLayout
    android:layout_width="fill_parent"
  android:layout_height="wrap_content"
  android:orientation="horizontal">

  <ImageView
  android:id="@+id/image1"
  android:layout_width="125dp"
  android:layout_height="125dp"
  android:src="@drawable/opel"></ImageView>

  <ImageView
  android:id="@+id/image2"
  android:layout_width="125dp"
  android:layout_height="125dp"
  android:src="@drawable/alfa"></ImageView>

  <ImageView
  android:id="@+id/image3"
  android:layout_width="125dp"
  android:layout_height="125dp"
  android:src="@drawable/honda2"></ImageView>

  <ImageView
  android:id="@+id/image4"
  android:layout_width="125dp"
  android:layout_height="125dp"
  android:src="@drawable/sports"></ImageView>

  <ImageView
  android:id="@+id/image5"
  android:layout_width="125dp"
  android:layout_height="125dp"
  android:src="@drawable/honda"></ImageView>

  <ImageView
  android:id="@+id/image6"
  android:layout_width="125dp"
  android:layout_height="125dp"
  android:src="@drawable/car"></ImageView>

  <ImageView
  android:id="@+id/image7"
  android:layout_width="125dp"
  android:layout_height="125dp"
  android:src="@drawable/carr"></ImageView>

  </LinearLayout>
  </HorizontalScrollView>
  </LinearLayout>




create Activity for horizontal scroll and remind one thing select your own images.

package car.care;

import android.app.Activity;
import android.content.Intent;
import android.os.Bundle;
import android.view.View;
import android.view.View.OnClickListener;
import android.widget.Button;
import android.widget.ImageView;

public class hori extends Activity implements OnClickListener{
     ImageView Display;
@Override
protected void onCreate(Bundle savedInstanceState) {
// TODO Auto-generated method stub
super.onCreate(savedInstanceState);
setContentView(R.layout.horizontalscroll);
Display=(ImageView)findViewById(R.id.IVDisplay );
Button btn5= (Button) findViewById(R.id.bChoose);
ImageView im1 =(ImageView)findViewById(R.id.image1);
ImageView im2 =(ImageView)findViewById(R.id.image2);
ImageView im3 =(ImageView)findViewById(R.id.image3);
ImageView im4 =(ImageView)findViewById(R.id.image4);
ImageView im5 =(ImageView)findViewById(R.id.image5);
ImageView im6 =(ImageView)findViewById(R.id.image6);
ImageView im7 =(ImageView)findViewById(R.id.image7);

btn5.setOnClickListener(this);
im1.setOnClickListener(this);
im2.setOnClickListener(this);
im3.setOnClickListener(this);
im4.setOnClickListener(this);
im5.setOnClickListener(this);
im6.setOnClickListener(this);
im7.setOnClickListener(this);





}
public void onClick(View v) {
// TODO Auto-generated method stub

switch(v.getId()){
case R.id.image1:
Display.setImageResource(R.drawable.opel);
break;

case R.id.image2:
Display.setImageResource(R.drawable.alfa);
break;

case R.id.image3:
Display.setImageResource(R.drawable.honda2);

break;
case R.id.image4:
Display.setImageResource(R.drawable.sports);

break;
case R.id.image5:
Display.setImageResource(R.drawable.honda);

break;
case R.id.image6:
Display.setImageResource(R.drawable.car);

break;
case R.id.image7:
Display.setImageResource(R.drawable.carr);

break;
case R.id.bChoose:


}








}

}



https://play.google.com/store/apps/developer?id=Manu+Jaggi

3 comments:

  1. This comment has been removed by the author.

    ReplyDelete
  2. In titanium appcelerator, you can do this using scrollableView

    var scrollableView = Ti.UI.createScrollableView({
    showPagingControl:true,
    scrollingEnabled: true,
    top: 360
    });

    Then, you can run a loop of all images or any content that you have, and add them to this view.

    for(i=0; i<mylength; i++) {
    eval("var view"+i+"=Ti.UI.createView();");
    profile_image = Ti.UI.createImageView({
    image: result[0]['profile_image'],
    left:15,
    width:82,
    height:104,
    top: 0
    });
    eval("view"+i+".add(profile_image);");
    eval("scrollableView.addView(view"+i+");");
    }

    mywin.add(scrollableView);

    ReplyDelete