Very classic ViewPager (with beautiful background, give you tired eyes visual impact), viewpager visual impact

Source: Internet
Author: User

Very classic ViewPager (with beautiful background, give you tired eyes visual impact), viewpager visual impact
For ViewPager usage, we need to take a picture first, so we can have a visual impact. Other ViewPager attacks are weak.



After reading the photo, we will come to achieve the next, just do it first step your project needs to have a android-support-v4.jar package, you know, if yes, you can view the structure image of the project in step 2 of ViewPager.



Activity_main.xml File

<LinearLayout xmlns: android = "http://schemas.android.com/apk/res/android" xmlns: tools = "http://schemas.android.com/tools" android: layout_width = "fill_parent" android: layout_height = "fill_parent" android: orientation = "vertical" tools: context = ". mainActivity "> <LinearLayout android: layout_width =" fill_parent "android: layout_height =" wrap_content "android: orientation =" horizontal "> <TextView android: id = "@ + id/textView1" android: layout_weight = "1" android: layout_width = "wrap_content" android: layout_height = "50dp" android: gravity = "center" android: text = "Beauty 1" android: textSize = "15dp" android: textStyle = "bold" android: background = "# FF0000" android: textColor = "#222222"> </TextView> <TextView android: id = "@ + id/textView2" android: layout_weight = "1" android: layout_width = "wrap_content" android: layout_height = "50dp" android: gravity = "center" android: text = "beauty 2" android: textSize = "15dp" android: textStyle = "bold" android: background = "# FFFFFF" android: textColor = "#222222"> </TextView> <TextView android: id = "@ + id/textView3" android: layout_weight = "1" android: layout_width = "wrap_content" android: layout_height = "50dp" android: gravity = "center" android: text = "Beauty 3" android: textSize = "15dp" android: textStyle = "bold" android: background = "# FFFFFF" android: textColor = "#222222"> </TextView> </LinearLayout> <ImageView android: id = "@ + id/cursor" android: layout_width = "120dp" android: layout_height = "4dp" android: scaleType = "matrix" android: background = "#000000"/> <android. support. v4.view. viewPager android: id = "@ + id/viewPager" android: layout_width = "fill_parent" android: layout_height = "fill_parent"> </android. support. v4.view. viewPager> </LinearLayout>
One. xml file
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"          android:layout_width="match_parent"          android:layout_height="45dp"         android:background="@drawable/one"         >  </LinearLayout>  
Two. xml file
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"          android:layout_width="match_parent"          android:layout_height="45dp"          android:background="@drawable/two"        >  </LinearLayout>  
Three. xml file
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"          android:layout_width="match_parent"          android:layout_height="45dp"         android:background="@drawable/three"         >  </LinearLayout>  
After the layout file is written, I will write the AdapterMyAdapter. java file of ViewPager.
Package com. example. viewpager; import java. util. list; import android. support. v4.view. pagerAdapter; import android. support. v4.view. viewPager; import android. view. view; public class MyAdapter extends PagerAdapter {List <View> viewLists; public MyAdapter (List <View> lists) {viewLists = lists;} @ Overridepublic int getCount () {// TODO Auto-generated method stub get sizereturn viewLists. size () ;}@ Overridepublic boolean isViewFromObject (View arg0, Object arg1) {// TODO Auto-generated method stubreturn arg0 == arg1 ;}@ Override public void destroyItem (View container, int position, Object object) {// TODO Auto-generated method stub destroy Item // super. destroyItem (container, position, object); (ViewPager) container ). removeView (viewLists. get (position) ;}@ Override public Object instantiateItem (View container, int position) {// TODO Auto-generated method stub instantiate Item // return super. instantiateItem (container, position); (ViewPager) container ). addView (viewLists. get (position), 0); return viewLists. get (position );}}

MainActivity. java File
Package com. example. viewpager; import java. util. arrayList; import java. util. list; import android. app. activity; import android. graphics. bitmap; import android. graphics. bitmapFactory; import android. graphics. color; import android. graphics. matrix; import android. OS. bundle; import android. support. v4.view. viewPager; import android. util. displayMetrics; import android. view. menu; import android. view. view; import android. view. view. onClickListener; import android. view. animation. animation; import android. view. animation. translateAnimation; import android. widget. imageView; import android. widget. textView; public class MainActivity extends Activity {private ViewPager viewPager; private ImageView imageView; private List <View> lists = new ArrayList <View> (); private MyAdapter myAdapter; private Bitmap cursor; private int offSet; private int currentItem; private Matrix matrix = new Matrix (); private int bmWidth; private Animation animation; private TextView textView1; private TextView textView2; private TextView textView3; @ Overrideprotected void onCreate (Bundle savedInstanceState) {super. onCreate (savedInstanceState); setContentView (R. layout. activity_main); imageView = (ImageView) findViewById (R. id. cursor) // The image textView1 = (TextView) findViewById (R. id. textView1); textView2 = (TextView) findViewById (R. id. textView2); textView3 = (TextView) findViewById (R. id. textView3); lists. add (getLayoutInflater (). inflate (R. layout. one, null); // Add the page to the viewPager set lists. add (getLayoutInflater (). inflate (R. layout. two, null); lists. add (getLayoutInflater (). inflate (R. layout. three, null); initeCursor (); // initialize the position myAdapter = new MyAdapter (lists); viewPager = (ViewPager) findViewById (R. id. viewPager); viewPager. setAdapter (myAdapter); viewPager. setOnPageChangeListener (new ViewPager. onPageChangeListener () {// veiwPager sliding listener @ Overridepublic void onPageSelected (int arg0) {// when sliding, the imageViw on the top slides slowly through animation // TODO Auto-generated method stubswitch (arg0) {case 0: if (currentItem = 1) {animation = new TranslateAnimation (offSet * 2 + bmWidth, 0, 0, 0); textView1.setBackgroundColor (Color. RED); textView2.setBackgroundColor (Color. WHITE); textView3.setBackgroundColor (Color. WHITE);} else if (currentItem = 2) {animation = new TranslateAnimation (offSet * 4 + 2 * bmWidth, 0, 0, 0); textView1.setBackgroundColor (Color. RED); textView2.setBackgroundColor (Color. WHITE); textView3.setBackgroundColor (Color. WHITE);} break; case 1: if (currentItem = 0) {animation = new TranslateAnimation (0, offSet * 2 + bmWidth, 0, 0); textView1.setBackgroundColor (Color. WHITE); textView2.setBackgroundColor (Color. RED); textView3.setBackgroundColor (Color. WHITE);} else if (currentItem = 2) {animation = new TranslateAnimation (offSet * 4 + 2 * bmWidth, offSet * 2 + bmWidth, 0, 0 ); textView1.setBackgroundColor (Color. WHITE); textView2.setBackgroundColor (Color. RED); textView3.setBackgroundColor (Color. WHITE);} break; case 2: if (currentItem = 0) {animation = new TranslateAnimation (0, offSet * 4 + bmWidth * 2, 0, 0 ); textView1.setBackgroundColor (Color. WHITE); textView2.setBackgroundColor (Color. WHITE); textView3.setBackgroundColor (Color. RED);} else if (currentItem = 1) {animation = new TranslateAnimation (offSet * 2 + bmWidth, offSet * 4 + 2 * bmWidth, 0, 0 ); textView1.setBackgroundColor (Color. WHITE); textView2.setBackgroundColor (Color. WHITE); textView3.setBackgroundColor (Color. RED);} break; default: break;} currentItem = arg0; animation. setDuration (500); animation. setFillAfter (true); imageView. startAnimation (animation);} @ Overridepublic void onPageScrolled (int arg0, float arg1, int arg2) {// TODO Auto-generated method stub} @ Overridepublic void merge (int arg0) {// TODO Auto-generated method stub}); textView1.setOnClickListener (new OnClickListener () {@ Overridepublic void onClick (View arg0) {// TODO Auto-generated method stubviewPager. setCurrentItem (0) ;}}); textView2.setOnClickListener (new OnClickListener () {@ Overridepublic void onClick (View arg0) {// TODO Auto-generated method stubviewPager. setCurrentItem (1) ;}}); textView3.setOnClickListener (new OnClickListener () {@ Overridepublic void onClick (View arg0) {// TODO Auto-generated method stubviewPager. setCurrentItem (2) ;}}) ;}@ Overridepublic boolean onCreateOptionsMenu (Menu menu) {// Inflate the menu; this adds items to the action bar if it is present. getMenuInflater (). inflate (R. menu. main, menu); return true;} private void initeCursor () {// calculates the position of the sliding image. cursor = BitmapFactory. decodeResource (getResources (), R. drawable. dog); bmWidth = cursor. getWidth (); DisplayMetrics dm; dm = getResources (). getDisplayMetrics (); offSet = (dm. widthPixels-3 * bmWidth)/6; matrix. setTranslate (offSet, 0); imageView. setImageMatrix (matrix); // The scaleType required for imageVie is matrix currentItem = 0 ;}}
By the way, there are a few more picture resources for you. I am a diaosi. The pictures of the dogs used are respectively dog.jpg one.jpg two.jpg three.jpg.



Copyright Disclaimer: This article is an original article by the blogger and cannot be reproduced without the permission of the blogger.

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.