Showing posts with label zoom. Show all posts
Showing posts with label zoom. Show all posts

Monday, March 21, 2011

Zooming a view completely

Here I'm discussing how to zoom a complete view with different UI controls in it.
For this i used setScaleX and setScaleY.

mainView.setScaleX(scaleX);
mainView.setScaleY(scaleY);
 
This will Scale the the view in X and Y axis. A value of scale 1 means that no scaling is applied.
In order to work this correctly it need to specify the pivot point correctly. We can set our pivot point using setPivotX and setPivotY.

mainView.setPivotX(pivot.x);
mainView.setPivotY(pivot.y);
 
My complete code 

Main.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
 xmlns:android="http://schemas.android.com/apk/res/android"
 android:orientation="vertical"
 android:id="@+id/linearLayout"
 android:layout_width="fill_parent"
 android:layout_height="fill_parent">
 <LinearLayout
  android:layout_width="wrap_content"
  android:orientation="horizontal"
  android:layout_height="wrap_content"
  android:id="@+id/linearLayout1">
  <Button
   android:text="Zoom In"
   android:id="@+id/buttonZoomIn"
   android:layout_width="wrap_content"
   android:layout_height="wrap_content" />
  <Button
   android:text="Normal"
   android:id="@+id/buttonNormal"
   android:layout_width="wrap_content"
   android:layout_height="wrap_content" />
  <Button
   android:text="Zoom Out"
   android:id="@+id/buttonZoomOut"
   android:layout_width="wrap_content"
   android:layout_height="wrap_content" />
 </LinearLayout>
 <TextView
  android:layout_width="fill_parent"
  android:layout_height="wrap_content"
  android:text="@string/hello" />
 <ProgressBar
  android:id="@+id/progressBar"
  android:layout_width="wrap_content"
  android:layout_height="wrap_content" />
 <ImageView
  android:id="@+id/imageView"
  android:src="@drawable/honeycombdroid"
  android:layout_width="wrap_content"
  android:layout_height="wrap_content" />
 <LinearLayout
  android:layout_width="200dp"
  android:orientation="vertical"
  android:layout_height="wrap_content"
  android:id="@+id/linearLayout1">
  <EditText
   android:id="@+id/editText1"
   android:layout_height="wrap_content"
   android:text="EditText"
   android:layout_width="match_parent"></EditText>
  <EditText
   android:id="@+id/editText1"
   android:layout_height="wrap_content"
   android:text="EditText"
   android:layout_width="match_parent"></EditText>
  <Button
   android:text="Button"
   android:id="@+id/button2"
   android:layout_width="wrap_content"
   android:layout_height="wrap_content"></Button>
 </LinearLayout>
</LinearLayout>
 

Here me only use that three buttons
buttonZoomIn , buttonNormal and buttonZoomOut
Then My main activity class

public class ZoomLayout extends Activity {
 View mainView = null;
 
 @Override
 public void onCreate(Bundle savedInstanceState) {
  super.onCreate(savedInstanceState);
  setContentView(R.layout.main);
  mainView =(LinearLayout)findViewById(R.id.linearLayout);
  
  Button buttonZoomOut = (Button)findViewById(R.id.buttonZoomOut);
  Button buttonNormal = (Button)findViewById(R.id.buttonNormal);
  Button buttonZoomIn = (Button)findViewById(R.id.buttonZoomIn);
  
  buttonZoomOut.setOnClickListener(new OnClickListener() {
   
   @Override
   public void onClick(View v) {
    zoom(0.5f,0.5f,new PointF(0,0));    
   }
  });
  buttonNormal.setOnClickListener(new OnClickListener() {
   
   @Override
   public void onClick(View v) {
    zoom(1f,1f,new PointF(0,0));  
   }
  });
  buttonZoomIn.setOnClickListener(new OnClickListener() {
   
   @Override
   public void onClick(View v) {
    zoom(2f,2f,new PointF(0,0));   
   }
  });
 }
 
 /** zooming is done from here */
 public void zoom(Float scaleX,Float scaleY,PointF pivot){
  mainView.setPivotX(pivot.x);
  mainView.setPivotY(pivot.y);  
  mainView.setScaleX(scaleX);
  mainView.setScaleY(scaleY);  
 } 
}
buttonZoomOut
Here zoom is the main function for zooming