Triển khai tính năng phóng to văn bản

Thử cách sử dụng 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 văn bản trong Compose.

Modifier.magnifier() →

Có trong Android 9 (API cấp 28) trở lên, tiện ích kính lúp là một kính lúp ảo hiển thị bản sao phóng to của View thông qua một ngăn lớp phủ đại diện cho ống kính. Tính năng này cải thiện trải nghiệm người dùng khi chèn và chọn văn bản. Khi áp dụng kính lúp cho văn bản, người dùng có thể định vị chính xác con trỏ hoặc ô điều khiển lựa chọn bằng cách xem văn bản được phóng to trong một ngăn theo sau ngón tay.

Hình 1 cho thấy cách kính lúp hỗ trợ việc chọn văn bản. API kính lúp không gắn liền với văn bản nên bạn có thể sử dụng tiện ích này trong nhiều trường hợp sử dụng, chẳng hạn như đọc văn bản nhỏ hoặc phóng to các tên địa điểm khó nhìn thấy trên bản đồ.

Kính lúp đã được tích hợp với các tiện ích trên nền tảng như TextView, EditText và WebView. Thư viện này cung cấp thao tác văn bản nhất quán trên các ứng dụng. Tiện ích này đi kèm với một API đơn giản và có thể dùng để phóng to bất kỳ View nào tuỳ thuộc vào ngữ cảnh của ứng dụng.

Sử dụng API

Bạn có thể dùng trình phóng to theo phương thức lập trình trong một chế độ xem tuỳ ý như sau:

val view: View = findViewById(R.id.view)
val magnifier = Magnifier.Builder(view).build()
magnifier.show(view.width / 2.0f, view.height / 2.0f)

View view = findViewById(R.id.view);
Magnifier magnifier = new Magnifier.Builder(view).build();
magnifier.show(view.getWidth() / 2, view.getHeight() / 2);

Giả sử hệ phân cấp khung hiển thị có bố cục đầu tiên, trình phóng to sẽ hiển thị trên màn hình và chứa một vùng nằm ở giữa trên các toạ độ đã cho trong khung hiển thị. Ngăn xuất hiện phía trên điểm giữa của nội dung đang được sao chép. Kính lúp vẫn tồn tại vô thời hạn cho đến khi người dùng đóng.

Đoạn mã sau đây cho biết cách thay đổi nền của khung hiển thị phóng to:

view.setBackgroundColor(...)

view.setBackgroundColor(...);

Giả sử màu nền có thể nhìn thấy trong kính lúp, thì nội dung của kính lúp đã lỗi thời, vì một khu vực của chế độ xem có nền cũ vẫn hiển thị. Để làm mới nội dung, hãy sử dụng phương thức update() như sau:

view.post { magnifier.update() }

view.post(magnifier::update);

Khi hoàn tất, hãy đóng kính lúp bằng cách gọi phương thức dismiss():

magnifier.dismiss()

magnifier.dismiss();

Phóng to khi người dùng tương tác

Một trường hợp sử dụng phổ biến của kính lúp là cho phép người dùng phóng to một vùng xem bằng cách chạm vào vùng đó, như minh hoạ trong hình 2.

Bạn có thể thực hiện việc này bằng cách cập nhật kính lúp theo các sự kiện chạm mà chế độ xem nhận được như sau:

imageView.setOnTouchListener { v, event ->
  when (event.actionMasked) {
    MotionEvent.ACTION_DOWN, MotionEvent.ACTION_MOVE -> {
      val viewPosition = IntArray(2)
      v.getLocationOnScreen(viewPosition)
      magnifier.show(event.rawX - viewPosition[0], event.rawY - viewPosition[1])
    }
    MotionEvent.ACTION_CANCEL, MotionEvent.ACTION_UP -> {
      magnifier.dismiss()
    }
  }
  true
}

imageView.setOnTouchListener(new View.OnTouchListener() {
    @Override
    public boolean onTouch(View v, MotionEvent event) {
        switch (event.getActionMasked()) {
            case MotionEvent.ACTION_DOWN:
                // Fall through.
            case MotionEvent.ACTION_MOVE: {
                final int[] viewPosition = new int[2];
                v.getLocationOnScreen(viewPosition);
                magnifier.show(event.getRawX() - viewPosition[0],
                               event.getRawY() - viewPosition[1]);
                break;
            }
            case MotionEvent.ACTION_CANCEL:
                // Fall through.
            case MotionEvent.ACTION_UP: {
                magnifier.dismiss();
            }
        }
        return true;
    }
});

Những cân nhắc khác khi phóng to văn bản

Đối với các tiện ích văn bản của nền tảng, bạn phải hiểu rõ hành vi cụ thể của kính lúp và bật tính năng phóng to cho chế độ xem văn bản tuỳ chỉnh một cách nhất quán trên nền tảng Android. Hãy cân nhắc những điểm sau:

• Kính lúp sẽ được kích hoạt ngay lập tức khi người dùng tóm lấy phần chèn hoặc ô điều khiển lựa chọn.
• Kính lúp luôn bám sát ngón tay của người dùng theo chiều ngang một cách trơn tru, trong khi ở chiều dọc, kính lúp được cố định vào giữa dòng văn bản hiện tại.
• Khi di chuyển theo chiều ngang, kính lúp chỉ di chuyển giữa ranh giới bên trái và bên phải của dòng hiện tại. Hơn nữa, khi thao tác chạm của người dùng rời khỏi các giới hạn này và khoảng cách theo chiều ngang giữa lần chạm và giới hạn gần nhất lớn hơn một nửa chiều rộng ban đầu của nội dung phóng to, thì kính lúp sẽ bị loại bỏ vì con trỏ không còn hiển thị bên trong kính lúp.
• Không thể kích hoạt kính lúp khi phông chữ văn bản quá lớn. Văn bản được coi là quá lớn khi chênh lệch giữa độ giảm và độ cao của phông chữ lớn hơn chiều cao của nội dung vừa với kính lúp. Việc kích hoạt trình phóng to trong trường hợp này không làm tăng thêm giá trị.