Tạo lớp khung hiển thị

Thử cách Compose
Jetpack Compose là bộ công cụ giao diện người dùng được đề xuất cho Android. Tìm hiểu cách sử dụng bố cục trong ứng dụng Compose.

Khung hiển thị tuỳ chỉnh được thiết kế hợp lý cũng giống như bất kỳ lớp nào được thiết kế hợp lý khác. Chiến dịch này gói gọn một tập hợp cụ thể có giao diện đơn giản, sử dụng CPU và bộ nhớ một cách hiệu quả, v.v. Trong ngoài việc trở thành một được thiết kế hợp lý, thì khung hiển thị tuỳ chỉnh phải thực hiện những việc sau:

  • Tuân thủ các tiêu chuẩn của Android.
  • Cung cấp các thuộc tính có thể tạo kiểu tuỳ chỉnh phù hợp với bố cục XML của Android.
  • Gửi các sự kiện hỗ trợ tiếp cận.
  • Tương thích với nhiều nền tảng Android.

Khung Android cung cấp một tập hợp các lớp cơ sở và thẻ XML để giúp bạn tạo một khung hiển thị đáp ứng tất cả các yêu cầu trên các yêu cầu liên quan. Bài học này thảo luận cách sử dụng khung Android để tạo chức năng của khung hiển thị .

Bạn có thể tìm thấy thêm trong Thành phần khung hiển thị tuỳ chỉnh.

Lớp con một chế độ xem

Tất cả các lớp thành phần hiển thị được xác định trong khung Android đều mở rộng View. Thông tin Chế độ xem tuỳ chỉnh cũng có thể trực tiếp mở rộng View, hoặc bạn có thể tiết kiệm thời gian bằng cách mở rộng một trong chế độ xem hiện tại chẳng hạn như Button.

Để cho phép Android Studio tương tác với khung hiển thị của bạn, tối thiểu bạn phải cung cấp một hàm khởi tạo nhận Context và một đối tượng AttributeSet làm tham số. Hàm khởi tạo này cho phép trình chỉnh sửa bố cục tạo và chỉnh sửa một thực thể của khung hiển thị.

Kotlin

class PieChart(context: Context, attrs: AttributeSet) : View(context, attrs)

Java

class PieChart extends View {
    public PieChart(Context context, AttributeSet attrs) {
        super(context, attrs);
    }
}

Xác định thuộc tính tuỳ chỉnh

Để thêm một View tích hợp sẵn vào giao diện người dùng, hãy chỉ định mã này trong một phần tử XML và kiểm soát giao diện và hành vi với các thuộc tính phần tử. Bạn cũng có thể thêm và tạo kiểu các khung hiển thị sử dụng XML. Người nhận bật hành vi này trong khung hiển thị tuỳ chỉnh, hãy làm như sau:

  • Xác định các thuộc tính tuỳ chỉnh cho khung hiển thị của bạn trong một phần tử tài nguyên <declare-styleable> .
  • Chỉ định giá trị cho các thuộc tính trong bố cục XML của bạn.
  • Truy xuất giá trị thuộc tính trong thời gian chạy.
  • Áp dụng các giá trị thuộc tính đã truy xuất cho khung hiển thị của bạn.

Phần này thảo luận cách xác định các thuộc tính tuỳ chỉnh và chỉ định giá trị của các thuộc tính đó. Phần tiếp theo đề cập đến truy xuất và áp dụng các giá trị trong thời gian chạy.

Để xác định các thuộc tính tuỳ chỉnh, hãy thêm tài nguyên <declare-styleable> vào dự án của bạn. Thông thường nên đặt những tài nguyên này vào Tệp res/values/attrs.xml. Sau đây là ví dụ về tệp attrs.xml:

<resources>
   <declare-styleable name="PieChart">
       <attr name="showText" format="boolean" />
       <attr name="labelPosition" format="enum">
           <enum name="left" value="0"/>
           <enum name="right" value="1"/>
       </attr>
   </declare-styleable>
</resources>

Mã này khai báo hai thuộc tính tuỳ chỉnh là showTextlabelPosition, thuộc về một thực thể có tên PieChart. Theo quy ước, tên của thực thể có thể định kiểu sẽ giống với tên tên của lớp xác định khung hiển thị tuỳ chỉnh. Mặc dù không nhất thiết phải tuân theo quy ước này, nhiều mã phổ biến trình chỉnh sửa phụ thuộc vào quy ước đặt tên này để cung cấp khả năng hoàn tất câu lệnh.

Sau khi định nghĩa các thuộc tính tuỳ chỉnh, bạn có thể sử dụng chúng trong các tệp XML bố cục giống như tính năng tích hợp sẵn . Chỉ điểm khác biệt là các thuộc tính tuỳ chỉnh của bạn thuộc về một không gian tên khác. Thay vì thuộc về thuộc không gian tên http://schemas.android.com/apk/res/android, chúng thuộc http://schemas.android.com/apk/res/[your package name]. Ví dụ: dưới đây là cách sử dụng các thuộc tính được xác định cho PieChart:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
   xmlns:custom="http://schemas.android.com/apk/res-auto">
 <com.example.customviews.charting.PieChart
     custom:showText="true"
     custom:labelPosition="left" />
</LinearLayout>

Để tránh phải lặp lại URI không gian tên dài, mẫu sẽ sử dụng lệnh xmlns. Lệnh này chỉ định bí danh custom cho không gian tên http://schemas.android.com/apk/res/com.example.customviews. Bạn có thể chọn bất kỳ biệt hiệu nào bạn muốn cho không gian tên của mình.

Hãy lưu ý tên của thẻ XML sẽ thêm khung hiển thị tuỳ chỉnh vào bố cục. Đó là tên đủ điều kiện của lớp khung hiển thị tuỳ chỉnh. Nếu lớp thành phần hiển thị của bạn là một lớp bên trong, hãy đủ điều kiện thêm lớp này bằng tên lớp ngoài của khung hiển thị. Ví dụ: Lớp PieChart có một lớp bên trong tên là PieView. Để sử dụng thuộc tính tùy chỉnh của lớp này, bạn hãy sử dụng thẻ com.example.customviews.charting.PieChart$PieView.

Áp dụng các thuộc tính tuỳ chỉnh

Khi một thành phần hiển thị được tạo từ bố cục XML, tất cả thuộc tính trong thẻ XML đó sẽ được đọc từ tài nguyên gói và truyền vào hàm khởi tạo của khung hiển thị dưới dạng AttributeSet. Mặc dù có thể đọc trực tiếp các giá trị từ AttributeSet, nhờ vậy có một số nhược điểm:

  • Các tham chiếu tài nguyên trong các giá trị thuộc tính không được phân giải.
  • Không áp dụng kiểu.

Thay vào đó, hãy chuyển AttributeSet đến obtainStyledAttributes() Phương thức này trả về một TypedArray mảng các giá trị đã bị tham chiếu và được định kiểu.

Trình biên dịch tài nguyên Android thực hiện nhiều việc cho bạn để gọi obtainStyledAttributes() dễ dàng hơn. Cho mỗi <declare-styleable> tài nguyên trong thư mục res/, R.java được tạo sẽ xác định cả một mảng thuộc tính ID và một tập hợp hằng số xác định chỉ mục cho từng thuộc tính trong mảng. Bạn sử dụng hằng số cần đọc các thuộc tính khỏi TypedArray. Dưới đây là cách thực hiện lớp PieChart đọc thuộc tính của nó:

Kotlin

init {
    context.theme.obtainStyledAttributes(
            attrs,
            R.styleable.PieChart,
            0, 0).apply {

        try {
            mShowText = getBoolean(R.styleable.PieChart_showText, false)
            textPos = getInteger(R.styleable.PieChart_labelPosition, 0)
        } finally {
            recycle()
        }
    }
}

Java

public PieChart(Context context, AttributeSet attrs) {
   super(context, attrs);
   TypedArray a = context.getTheme().obtainStyledAttributes(
        attrs,
        R.styleable.PieChart,
        0, 0);

   try {
       mShowText = a.getBoolean(R.styleable.PieChart_showText, false);
       textPos = a.getInteger(R.styleable.PieChart_labelPosition, 0);
   } finally {
       a.recycle();
   }
}

Lưu ý rằng các đối tượng TypedArray là một tài nguyên dùng chung và phải được tái chế sau khi sử dụng.

Thêm thuộc tính và sự kiện

Thuộc tính là một cách hiệu quả để kiểm soát hành vi và giao diện của thành phần hiển thị, nhưng chúng chỉ có thể đọc được khi khởi tạo khung hiển thị. Để cung cấp hành vi động, hãy hiển thị phương thức getter và phương thức setter cho mỗi thuộc tính tùy chỉnh. Đoạn mã sau đây minh hoạ cách PieChart hiển thị một thuộc tính có tên là showText:

Kotlin

fun isShowText(): Boolean {
    return mShowText
}

fun setShowText(showText: Boolean) {
    mShowText = showText
    invalidate()
    requestLayout()
}

Java

public boolean isShowText() {
   return mShowText;
}

public void setShowText(boolean showText) {
   mShowText = showText;
   invalidate();
   requestLayout();
}

Lưu ý rằng setShowText sẽ gọi invalidate()requestLayout(). Những cuộc gọi này có ý nghĩa quan trọng để đảm bảo khung hiển thị hoạt động đáng tin cậy. Bạn cần để vô hiệu hoá chế độ xem sau khi có bất kỳ thay đổi nào về thuộc tính có thể làm thay đổi giao diện, để hệ thống biết cần phải vẽ lại. Tương tự, bạn cần yêu cầu một bố cục mới nếu thuộc tính thay đổi theo cách có thể ảnh hưởng đến kích thước hoặc hình dạng của chế độ xem. Việc quên các lệnh gọi phương thức này có thể khiến khó tìm lỗi.

Khung hiển thị tuỳ chỉnh cũng phải hỗ trợ trình nghe sự kiện để giao tiếp các sự kiện quan trọng. Cho thực thể, PieChart hiển thị một sự kiện tuỳ chỉnh có tên là OnCurrentItemChanged để thông báo cho trình nghe rằng người dùng đã xoay biểu đồ hình tròn để tập trung vào lát hình tròn mới.

Bạn rất dễ quên hiển thị các thuộc tính và sự kiện, đặc biệt khi bạn là người dùng duy nhất của khung hiển thị tuỳ chỉnh. Dành thời gian để xác định kỹ giao diện của chế độ xem giúp giảm thiểu việc bảo trì trong tương lai chi phí. Bạn nên tuân theo một nguyên tắc là luôn hiển thị mọi thuộc tính ảnh hưởng đến diện mạo hoặc hành vi của chế độ xem tuỳ chỉnh của mình.

Thiết kế hỗ trợ tiếp cận

Khung hiển thị tuỳ chỉnh phải hỗ trợ nhiều người dùng. Số liệu này bao gồm cả những người dùng có khuyết tật không cho phép trẻ nhìn thấy hoặc sử dụng màn hình cảm ứng. Để hỗ trợ người dùng bị khuyết tật, hãy làm như sau:

  • Gắn nhãn các trường nhập dữ liệu bằng thuộc tính android:contentDescription .
  • Gửi các sự kiện hỗ trợ tiếp cận bằng cách gọi sendAccessibilityEvent() khi thích hợp.
  • Hỗ trợ các tay điều khiển thay thế, chẳng hạn như D-pad hoặc bi xoay.

Để biết thêm thông tin về cách tạo chế độ xem có thể truy cập, hãy xem Tăng khả năng hỗ trợ tiếp cận của ứng dụng.