第六章使用视图显示图片和菜单

一．使用Image视图显示图片

1. ImageView视图——用来在设备屏幕上显示图片的视图

<?xml version="1.0" encoding="utf-8"?>
 
<LinearLayout android:layout_height="match_parent"
     
     android:layout_width="wrap_content"
     
     android:id="@+id/activity_main"
     
     tools:context="com.cwx.image.MainActivity"
     
     xmlns:tools="http://schemas.android.com/tools"
     
     xmlns:app="http://schemas.android.com/apk/res-auto"
     
     xmlns:android="http://schemas.android.com/apk/res/android"
     
     android:orientation="vertical">
     <android.support.v7.widget.AppCompatImageView
         
         android:layout_width="match_parent"
         
         android:layout_height="match_parent"
         
         android:src="@mipmap/girl">
     </android.support.v7.widget.AppCompatImageView>
 </LinearLayout>

2.ImageSwitcher

希望一些图片过渡到另一张时可以实现一些动画效果，这是可以用该视图

package com.cwx.six;
import android.support.v7.app.ActionBar;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.View;
import android.view.animation.AnimationUtils;
import android.widget.Button;
import android.widget.ImageSwitcher;
import android.widget.ImageView;
import android.widget.Toast;
import android.widget.ViewSwitcher;
public class MainActivity extends AppCompatActivity {
     private ImageSwitcher imgSwitcher;
     private Button btnViewWindows,btnViewButterfly;
     @Override
     protected void onCreate(Bundle savedInstanceState) {
         super.onCreate(savedInstanceState);
         setContentView(R.layout.activity_main);
         imgSwitcher = (ImageSwitcher)findViewById(R.id.imageSwitcher);
         imgSwitcher.setInAnimation(AnimationUtils.loadAnimation(this,android.R.anim.fade_in));
         imgSwitcher.setOutAnimation(AnimationUtils.loadAnimation(this,android.R.anim.fade_out));
         btnViewWindows = (Button)findViewById(R.id.button2);
         btnViewButterfly = (Button) findViewById(R.id.button);
         imgSwitcher.setFactory(new ViewSwitcher.ViewFactory() {
             @Override
             public View
makeView() {
                 ImageView myView = new ImageView(getApplicationContext());
                
myView.setScaleType(ImageView.ScaleType.FIT_CENTER);
                 myView.setLayoutParams(new ImageSwitcher.LayoutParams(ActionBar.LayoutParams.WRAP_CONTENT,ActionBar.LayoutParams.WRAP_CONTENT));
                 return myView;
             }
         });
         btnViewWindows.setOnClickListener(new View.OnClickListener()
{
             @Override
             public void onClick(View v) {
                 Toast.makeText(getApplicationContext(), "View Windows",Toast.LENGTH_LONG).show();
                 imgSwitcher.setImageResource(R.mipmap.windows);
             }
         });
         btnViewButterfly.setOnClickListener(new View.OnClickListener()
{
             @Override
             public void onClick(View v) {
                 Toast.makeText(getApplicationContext(), "View Butterfly",Toast.LENGTH_LONG).show();
                 imgSwitcher.setImageResource(R.mipmap.butterfly);
             }
         });
     }
 }

<?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"
     
     android:paddingBottom="@dimen/activity_vertical_margin"
     
     android:paddingLeft="@dimen/activity_horizontal_margin"
     
     android:paddingRight="@dimen/activity_horizontal_margin"
     
     android:paddingTop="@dimen/activity_vertical_margin"
     
     tools:context="com.cwx.six.MainActivity">
     <Button
         
         android:text="View Windows"
         
         android:layout_width="wrap_content"
         
         android:layout_height="wrap_content"
         
         android:id="@+id/button2"
         
         />
     <ImageSwitcher
         
         android:layout_width="match_parent"
         
         android:layout_height="match_parent"
         
         android:layout_alignParentStart="true"
         
         android:layout_below="@+id/button2"
         
         android:id="@+id/imageSwitcher">
     </ImageSwitcher>
     <Button
         
         android:text="View Butterfly"
         
         android:layout_width="wrap_content"
         
         android:layout_height="wrap_content"
         
         android:id="@+id/button"
         
         android:layout_alignParentTop="true"
         
         android:layout_alignParentEnd="true"
         
         android:layout_alignParentRight="true"
         
         />
 </RelativeLayout>

3.GridView

该视图将内容显示在一个可滚动的二维框格中。可以将GridView和ImageView搭配使用来显示一系列图片

<?xml version="1.0" encoding="utf-8"?>
 
<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
     
     xmlns:app="http://schemas.android.com/apk/res-auto"
     
     xmlns:tools="http://schemas.android.com/tools"
     
     android:id="@+id/activity_main"
     
     android:layout_width="match_parent"
     
     android:layout_height="match_parent"
     
     tools:context="com.cwx.bpp.MainActivity">
     <GridView
         
         android:layout_width="384dp"
         
         android:layout_height="511dp"
         
         tools:layout_editor_absoluteX="0dp"
         
         tools:layout_editor_absoluteY="0dp"
         
         app:layout_constraintLeft_toLeftOf="@+id/activity_main"
         
         tools:layout_constraintLeft_creator="0"
         
         app:layout_constraintTop_toTopOf="@+id/activity_main"
         
         tools:layout_constraintTop_creator="0"
         
         app:layout_constraintRight_toRightOf="@+id/activity_main"
         
         tools:layout_constraintRight_creator="0"
         
         app:layout_constraintBottom_toBottomOf="@+id/activity_main"
         
         tools:layout_constraintBottom_creator="0"
         
         android:id="@+id/gridview" />
 </android.support.constraint.ConstraintLayout>

package com.cwx.bpp;
import android.content.Context;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.View;
import android.view.ViewGroup;
import android.widget.AdapterView;
import android.widget.BaseAdapter;
import android.widget.GridView;
import android.widget.ImageView;
import android.widget.Toast;
public class MainActivity extends AppCompatActivity {
     Integer[] imageIDs = {
             R.mipmap.butterfly,
             R.mipmap.windows,
             R.mipmap.ic_launcher
     
     };
     @Override
     protected void onCreate(Bundle savedInstanceState) {
         super.onCreate(savedInstanceState);
         setContentView(R.layout.activity_main);
         GridView gridView = (GridView)
findViewById(R.id.gridview);
         gridView.setAdapter(new ImageAdapter(this));
         gridView.setOnItemClickListener(new AdapterView.OnItemClickListener()
         {
             public void onItemClick(AdapterView parent,
                                     View
v, int position, long id)
             {
                 Toast.makeText(getBaseContext(),
                         "pic" + (position + 1) + " selected",
                         Toast.LENGTH_SHORT).show();
             }
         });
     }
     public class ImageAdapter extends BaseAdapter
     {
         private Context context;
         public ImageAdapter(Context
c)
         {
             context = c;
         }
         //---returns the number of images---
         
         public int getCount() {
             return imageIDs.length;
         }
         //---returns the item---
         
         public Object
getItem(int position) {
             return position;
         }
         //---returns the ID of an item---
         
         public long getItemId(int position) {
             return position;
         }
         //---returns an ImageView view---
         
         public View
getView(int position, View convertView,
                             ViewGroup parent)
         {
             ImageView imageView;
             if (convertView
== null) {
                 imageView = new ImageView(context);
                
imageView.setLayoutParams(new
                         
                         GridView.LayoutParams(150, 150));
                 imageView.setScaleType(
                        
ImageView.ScaleType.CENTER_CROP);
                 imageView.setPadding(5, 5, 5, 5);
             } else {
                 imageView = (ImageView)
convertView;
             }
             imageView.setImageResource(imageIDs[position]);
             return imageView;
         }
     }
 }