- Thư mục lưu trữ: các tài nguyên hình ảnh được lưu trữ trong thu mục res/drawable. Có thể có nhiều thư mục drawable theo từ hạn định khác nhau: drawable-hdpi, drawable-xhdpi, drawable-mdpi, drawable-xxhdp,…
- Định dạng: tài nguyên hình ảnh bao gồm cả định dạng: .xml và định dạng hình ảnh (.png, .gif, .jpg).
- Truy xuất: bao gồm 2 cách thức:
- Java: R.drawable.<tên tài nguyên>. Ví dụ:
Resources res = getResources();
Drawable drawable = res.getDrawable(R.drawable.ic_launcher); - XML: @[pakage:]drawable/<tên tài nguyên>. Ví dụ:
<ImageView
android:layout_width=”50dp”
android:layout_height=”50dp”
android:src=”@drawable/ic_launcher” />
- Java: R.drawable.<tên tài nguyên>. Ví dụ:
- Các định dạng tài nguyên hình ảnh: Bitmap, Shape, LayerList, StateList, LevelList, Transition, Inset, Clip, Scale và Nine-Patch.
Bây giờ sang phần giới thiệu và demo các dạng tài nguyên hình ảnh:
- Bitmap:
- Định dạng ảnh nhị phân, Android hỗ trợ 3 định dạng tài nguyên hình ảnh: png, jpg và gif.
- Các thực thi của Bitmap bao gồm: sử dụng như tài nguyên thông qua R.drawable.<tên file>. Tham chiếu biên dịch tài nguyên thông qua đối tượng BitmapDrawable.
- Sử dụng các thuộc tính Bitmap trong XML: AntinAlias, Dither, Filter, Gravity, Mipmap, Tilemode và Automirrored.
- Truy xuất trong java code: BitmapDrawable drawable = (BitmapDrawable) getResources().getDrawable(R.drawable.mipmap)
- Hướng dẫn Demo:
- Đầu tiên ta chép tấm hình này vào thư mục drawable:
- Trong thư mục này tiếp tục tạo file xml có nội dung như sau:
<?xml version="1.0" encoding="utf-8"?> <bitmap xmlns:android="http://schemas.android.com/apk/res/android" android:src="@drawable/caro" android:tileMode="disabled" android:gravity="center"> </bitmap>
- Tạo thiết kế file xml như sau:
<LinearLayout xmlns:tools="http://schemas.android.com/tools" xmlns:android="http://schemas.android.com/apk/res/android" android:id="@+id/container" android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="vertical" > <LinearLayout android:layout_width="match_parent" android:layout_height="wrap_content" android:orientation="vertical" > <TextView android:id="@+id/tvTileModes" android:layout_width="match_parent" android:layout_height="wrap_content" android:background="@android:color/darker_gray" android:text="@string/tilemodes" android:textAppearance="?android:attr/textAppearanceLarge" /> <RadioGroup android:id="@+id/rgrTileModes" android:layout_width="wrap_content" android:layout_height="wrap_content" android:orientation="horizontal" > <RadioButton android:id="@+id/rbtDefault" android:layout_width="wrap_content" android:layout_height="wrap_content" android:checked="true" android:text="@string/Default" android:textSize="12sp" /> <RadioButton android:id="@+id/rbtClamp" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="@string/Clamp" android:textSize="12sp" /> <RadioButton android:id="@+id/rbtRepeat" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="@string/Repeat" android:textSize="12sp" /> <RadioButton android:id="@+id/rbtMirror" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="@string/Mirror" android:textSize="12sp" /> </RadioGroup> </LinearLayout> <LinearLayout android:layout_width="match_parent" android:layout_height="wrap_content" android:orientation="vertical" > <TextView android:id="@+id/tvGravity" android:layout_width="match_parent" android:layout_height="wrap_content" android:background="@android:color/darker_gray" android:text="@string/gravity" android:textAppearance="?android:attr/textAppearanceLarge" /> <LinearLayout android:layout_width="match_parent" android:layout_height="wrap_content" > <RadioGroup android:id="@+id/rgrGravity" android:layout_width="wrap_content" android:layout_height="match_parent" > <RadioButton android:id="@+id/rbtnTop" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="@string/top" /> <RadioButton android:id="@+id/rbtnLeft" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="@string/left" /> <RadioButton android:id="@+id/rbtnRight" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="@string/right" /> <RadioButton android:id="@+id/rbtnBottom" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="@string/bottom" /> <RadioButton android:id="@+id/rbtnFill" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="@string/fill" /> <RadioButton android:id="@+id/rbtnFillHorizontal" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="@string/fillhorizontal" /> <RadioButton android:id="@+id/rbtnFillVertical" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="@string/fillvertical" /> <RadioButton android:id="@+id/rbtnCenter" android:layout_width="wrap_content" android:layout_height="wrap_content" android:checked="true" android:text="@string/center" /> <RadioButton android:id="@+id/rbtnTopLeft" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="@string/topleft" /> <RadioButton android:id="@+id/rbtnTopRight" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="@string/topright" /> <RadioButton android:id="@+id/rbtnBottomLeft" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="@string/botomleft" /> <RadioButton android:id="@+id/rbtnBottomRight" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="@string/bottomright" /> </RadioGroup> <ImageView android:id="@+id/imvTestPosition" android:layout_width="match_parent" android:layout_height="match_parent" android:contentDescription="@null" android:scaleType="fitXY" android:src="@drawable/gravity" /> </LinearLayout> </LinearLayout> </LinearLayout>
- Tiếp theo trong java code hứng lại các tài nguyên và xử lý khi người dùng tương tác vào như sau:
package com.tqky.demobitmapdrawable; import android.graphics.Shader.TileMode; import android.graphics.drawable.BitmapDrawable; import android.os.Bundle; import android.support.v7.app.ActionBarActivity; import android.view.Gravity; import android.widget.ImageView; import android.widget.RadioGroup; import android.widget.RadioGroup.OnCheckedChangeListener; public class MainActivity extends ActionBarActivity { BitmapDrawable drawable; ImageView imageView; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); imageView = (ImageView) findViewById(R.id.imvTestPosition); drawable = (BitmapDrawable) getResources().getDrawable( R.drawable.gravity); ((RadioGroup) findViewById(R.id.rgrTileModes)).setOnCheckedChangeListener(new OnCheckedChangeListener() { @Override public void onCheckedChanged(RadioGroup group, int checkedId) { // TODO Auto-generated method stub switch (checkedId) { case R.id.rbtDefault: imageView.setImageBitmap(null); drawable.setTileModeX(null); imageView.setImageDrawable(drawable); break; case R.id.rbtClamp: imageView.setImageBitmap(null); drawable.setTileModeX(TileMode.CLAMP); imageView.setBackground(drawable); break; case R.id.rbtMirror: imageView.setImageBitmap(null); drawable.setTileModeX(TileMode.MIRROR); imageView.setBackground(drawable); break; case R.id.rbtRepeat: imageView.setImageBitmap(null); drawable.setTileModeX(TileMode.REPEAT); imageView.setBackground(drawable); break; } } }); ((RadioGroup) findViewById(R.id.rgrGravity)).setOnCheckedChangeListener(new OnCheckedChangeListener() { @Override public void onCheckedChanged(RadioGroup group, int checkedId) { // TODO Auto-generated method stub switch (checkedId) { case R.id.rbtnBottom: imageView.setImageBitmap(null); drawable.setGravity(Gravity.BOTTOM); imageView.setBackground(drawable); break; case R.id.rbtnBottomLeft: imageView.setImageBitmap(null); drawable.setGravity(Gravity.BOTTOM | Gravity.LEFT); imageView.setBackground(drawable); break; case R.id.rbtnBottomRight: imageView.setImageBitmap(null); drawable.setGravity(Gravity.BOTTOM | Gravity.RIGHT); imageView.setBackground(drawable); break; case R.id.rbtnTop: imageView.setImageBitmap(null); drawable.setGravity(Gravity.TOP); imageView.setBackground(drawable); break; case R.id.rbtnTopLeft: imageView.setImageBitmap(null); drawable.setGravity(Gravity.TOP | Gravity.LEFT); imageView.setBackground(drawable); break; case R.id.rbtnTopRight: imageView.setImageBitmap(null); drawable.setGravity(Gravity.TOP | Gravity.RIGHT); imageView.setBackground(drawable); break; case R.id.rbtnLeft: imageView.setImageBitmap(null); drawable.setGravity(Gravity.LEFT); imageView.setBackground(drawable); break; case R.id.rbtnRight: imageView.setImageBitmap(null); drawable.setGravity(Gravity.RIGHT); imageView.setBackground(drawable); break; case R.id.rbtnCenter: imageView.setImageBitmap(null); drawable.setGravity(Gravity.CENTER); imageView.setBackground(drawable); break; case R.id.rbtnFill: imageView.setImageBitmap(null); drawable.setGravity(Gravity.FILL); imageView.setBackground(drawable); break; case R.id.rbtnFillHorizontal: imageView.setImageBitmap(null); drawable.setGravity(Gravity.FILL_HORIZONTAL); imageView.setBackground(drawable); break; case R.id.rbtnFillVertical: imageView.setImageBitmap(null); drawable.setGravity(Gravity.FILL_VERTICAL); imageView.setBackground(drawable); break; } } }); } }
Ở trong đoạn code này chủ yếu là demo về các thuộc tính của bitmap. Sau này có thể áp dụng 1 cách hợp lý.
- Kết quả khi chạy chương trình như sau:
khi ta chọn vào các radioButton thì hình ảnh sẽ được thay đổi theo. - Tải code demo tại Đây. Ở bài sau mình sẽ tiếp tục hướng dẫn các bạn làm tiếp các dạng tài nguyên còn lại.
- Đầu tiên ta chép tấm hình này vào thư mục drawable: