PhotoView開源框架：可以瀏覽圖片，通過手指的動作控制圖片的縮放和移動檢視，還提供一個photoview，讓我們來代替imageview。

一、配置環境

       開啟工作空間中的build.gradle，新增程式碼：maven { url "https://jitpack.io" }

    maven { url "https://jitpack.io" }

             開啟app專案中的build.gradle，新增依賴的外部環境： compile 'com.github.chrisbanes:PhotoView:1.3.0'

    compile 'com.github.chrisbanes:PhotoView:1.3.0'
 

完成以後構建一下。

二、實現程式碼

PhotoView其實很簡單，一句話可以實現放大縮小的功能，但是圖片的PX會失真，所以配合寫了一個方法，寬度匹配螢幕，高按比例縮放，這樣可以避免失真。

新建一個類PhotoDetailActivity：

public class PhotoDetailActivity extends Activity {
    @InjectView(R.id.iv)
    ImageView iv;
    private int scale;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.detail);
        ButterKnife.inject(this);
        displayImage();
         //建立一個photoview的一個attacher
        PhotoViewAttacher attacher = new PhotoViewAttacher(iv);


    }

    private void displayImage() {
        //想讓圖片寬是螢幕的寬度
        Bitmap bitmap = BitmapFactory.decodeResource(getResources(), R.mipmap.yangyang);
        //測量
        BitmapFactory.Options options = new BitmapFactory.Options();
        options.inJustDecodeBounds=true;//只測量
        int height = bitmap.getHeight();
        int width = bitmap.getWidth();
        //再拿到螢幕的寬
        WindowManager windowManager = getWindowManager();
        Display display = windowManager.getDefaultDisplay();
        int screenWidth = display.getWidth();
        //計算如果讓照片是螢幕的寬，選要乘以多少？
        scale = screenWidth/width;
        //這個時候。只需讓圖片的寬是螢幕的寬，高乘以比例
        int  displayHeight=height*scale;//要顯示的高，這樣避免失真
        //最終讓圖片按照寬是螢幕 高是等比例縮放的大小
        LinearLayout.LayoutParams layoutParams = new LinearLayout.LayoutParams(screenWidth, displayHeight);
        iv.setLayoutParams(layoutParams);
    }
}
 

PhotoViewAttacher attacher = new PhotoViewAttacher(iv) 這句程式碼實現了圖片的放大縮小。

displayImage() 方法就是避免失真的方法，可以封裝成一個類直接呼叫。

在MainActivity中的程式碼：

public class MainActivity extends AppCompatActivity {

    @InjectView(R.id.iv1)
    ImageView iv1;
    @InjectView(R.id.viewpager)
    ViewPager viewpager;

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

    public void click(View v) {

        startActivity(new Intent(MainActivity.this, PhotoDetailActivity.class));

    }
}
 

XML中的程式碼： 

<android.support.v4.view.ViewPager
        android:id="@+id/viewpager"
        android:layout_width="wrap_content"
        android:layout_height="200dp">

    </android.support.v4.view.ViewPager>

新建的XML檔案：

<ImageView
        android:src="@mipmap/yangyang"
        android:layout_height="wrap_content"
        android:layout_width="wrap_content"
        android:id="@+id/iv"
        />

清單檔案中註冊：

<activity android:name=".PhotoDetailActivity"
            android:theme="@android:style/Theme.Holo.NoActionBar"
            ></activity>

完成，執行。

顯示如圖：