Tạo và sử dụng Theme trong lập trình Android

Theme trong ứng dụng Android

Theme giống như style đã trình bày tại: Thuộc tính style trong Android, nó là tập hợp các định nghĩa tài nguyên, thuộc tính để áp dụng vào các phần tử View. Chỉ có điều style có hiệu lực với phần tử áp dụng nó, còn Theme có thể thiết lập ở các phần tử gốc và các phần tử con kế thừa và truy cập vào các thuộc tính từ theme. Theme được định nghĩa trong style.xml và gán vào phần tử bằng thuộc tính android:theme

Theme thường được gán vào các phần tử gốc, qua đó các phần tử con sẽ truy cập thuộc tính theme, các phần tử gốc hay gán theme đó là application hoặc Activity trong manifest. Nếu gán theme cho application, thì các Activity trong ứng dụng mặc định kế thừa theme từ application, tương tự cho đến các View tạo ra từ Activity, bạn cũng có thể gán Theme cho Activity hoặc các View gốc của layout nhằm sử dụng một theme khác với theme kế thừa.

Sau đây sẽ thực thi từng bước tạo ra và vận dụng một Theme

Hãy chạy Android Studio và tạo ra ứng dụng theo mẫu Bottom Navigator Bottom đặt tên ThemeTuorial

Ứng dụng mẫu này đã đĩnh nghĩa sẵn một theme tên là AppTheme (xem trong styles.xml), theme này được gán vào application trong manifests (có nghĩa là các Activity nằm trong application sẽ kế thừa theme này). Giờ hãy mở styles.xml xem một theme được tạo ra và có các thành phần nào.

Tạo một theme trong styles.xml

Vì một theme chứa rất nhiều thuộc tính ( sắc tố, kích cỡ, vị trí, font chữ … ) sử dụng mặc định bởi nhiều loại View ( Button, TextView … ) trong Android nên khi tạo một theme mới thường kế thừa từ một theme thuộc thư viện Android, sau đó tuỳ biến thêm bớt, biến hóa những thành phần ( Các tìm hiểu thêm hãy xem tại CÁC THUỘC TÍNH TRONG THEME ) .

Quay trở lại ví dụ trên, theme AppTheme kế thừa từ Theme.AppCompat.Light.DarkActionBar, sau đó nó điều chỉnh lại các thuộc tính
colorPrimary, colorPrimaryDark, colorAccent

Tương tự bạn có thể tạo ra Theme thứ 2, và đặt tên là MyAppTheme theo cách tương tự, ta sẽ định nghĩa lại một số thành phần (theme sẽ có màu sắc loè loẹt để bạn dễ nhận biết):

values/colors.xml (Định nghĩa màu sẽ dùng)

    #008577
    #00574B
    #D81B60

    #FF8A80
    #FF80AB
    #82B1FF
    #00C853
    #C51162
    #0091EA
    #B3E5FC

values/styles.xml

Để áp dụng Theme mới này, hãy gán thuộc tính theme của Activity trong manifests bằng tên của theme này, hoặc thay thuộc tính theme của application trong manifests để tất cả các Activity kế thừa theme này, ví dụ:

AndroidManifest.xml

Kết quả chạy với theme mới MyAppTheme

Chuyển đổi qua lại các Theme

Các Activety trước khi nạp layout (trước khi chạy setContentView) có thể gọi phương thức setTheme(themeid), để Activity sử dụng một theme theo ID tài nguyên bạn chỉ ra. Ngoài ra, bạn có thể lưu ID của theme lâu dài trong SharedPreferences để mỗi lần chạy sẽ sử dụng theme mà bạn lưu. Ta sẽ sử dụng cách này để chuyển đổi qua lại giữa 2 theme đang có ở trên là R.style.AppTheme và R.style.MyAppTheme

Toàn bộ code trong onCreate của Activity

//ID của theme mà Activity sử dụng
int themeIdcurrent;

@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);

    //Đọc ID theme đã lưu, nếu chưa lưu thì dùng R.style.MyAppTheme
    SharedPreferences locationpref = getApplicationContext()
            .getSharedPreferences("MainActivity", MODE_PRIVATE);
    themeIdcurrent = locationpref.getInt("themeid",R.style.MyAppTheme);

    //Thiết lập theme cho Activity
    setTheme(themeIdcurrent);

    setContentView(R.layout.activity_main);
    findViewById(R.id.button).setOnClickListener(new View.OnClickListener() {
        @Override
        public void onClick(View v) {

            //Chuyển đổi theme
            themeIdcurrent = themeIdcurrent == R.style.MyAppTheme ? R.style.AppTheme : R.style.MyAppTheme;

            //Lưu lại theme ID
            SharedPreferences locationpref = getApplicationContext()
                    .getSharedPreferences("MainActivity", MODE_PRIVATE);
            SharedPreferences.Editor spedit = locationpref.edit();
            spedit.putInt("themeid", themeIdcurrent);
            spedit.apply();

            //Tạo lại Activity để áp dụng theme mởi đổi
            recreate();

        }
    });

    mTextMessage = (TextView) findViewById(R.id.message);
    BottomNavigationView navigation = (BottomNavigationView) findViewById(R.id.navigation);
    navigation.setOnNavigationItemSelectedListener(mOnNavigationItemSelectedListener);
}

Kết quả chạy ứng dụng :

Thêm giá trị thuộc tính trong theme

Ngoài việc thiết lập giá trị những thuộc tính ảnh hưởng tác động đến những View trong theme ( xem những thuộc tính tại CÁC THUỘC TÍNH TRONG THEME ), bạn hoàn toàn có thể lan rộng ra theme chứa những thuộc tính chứa giá trị mới sau đó những View truy vấn để sử dụng thuộc tính này .

Tạo ra các tên thuộc tính mới trong ứng dụng

Thường sẽ định nghĩa các tên thuộc tính trong file values/attrs.xml, một thuộc tính sẽ có cấu trúc khai báo như sau:

Trong đó format để quy định loại dữ liệu của thuộc tính, có thể nhận các giá trị như: string, boolean, float, dimension (các kích thước px, dp …), reference (tham chiếu đến icon, image, drawable …)

Ví dụ định nghĩa tên thuộc tính mới là myTextViewSize và myTextColor

values/attrs.xml

Như vậy theme có thêm 2 thuộc tính với giá trị đi cùng, trong các View nếu muốn sử dụng truy cập đến giá trị thuộc tính này thì sử dụng cú pháp lấy giá trị của thuộc tính Theme hiện tại "?tên_thuộc_tính"

Ví dụ :

Như vậy giá trị textSize và textColor của TextView trên được xác lập từ Theme .
Từ bài viết này, đủ để biết cách tạo và sử dụng Theme một cách hoàn hảo, hãy tuỳ biến để mọi thành phần trong View ứng dụng đều những thể thiết lập từ Theme, điều này khiến ứng dụng linh động rất nhiều

Source: https://bem2.vn
Category: Ứng dụng hay