Thêm hình ảnh/biểu tượng bổ sung vào CardFragment (Android Wear)

Question

Tôi đang xem hình ảnh mẫu này từ Google và cố gắng tìm hiểu cách triển khai một cái gì đó như thế này.

Có vẻ rất giống với bố cục tiêu chuẩn CardFragment có tiêu đề, mô tả và biểu tượng. Nhưng tôi thấy hình ảnh/hoạt ảnh bổ sung ở bên trái, điều này khiến tôi nghĩ rằng họ sử dụng bố cục tùy chỉnh. Điều này có thể thực hiện với tiêu chuẩn CardFragment không? Hoặc là có một lớp tiện lợi khác cho phép hỗ trợ cho nhiều biểu tượng?

Answer 1

tôi thực hiện điều này bằng cách mở rộng CardFragment và trọng onCreateContentView:

@Override 
public View onCreateContentView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) { 

    mRootView = (ViewGroup) inflater.inflate(R.layout.fragment_my_card, null); 
    ... 
} 

này cho phép bạn kiểm soát những gì diễn ra trên thẻ trắng.

Answer 2

Hình ảnh mẫu mà bạn đang hiển thị thực sự là thông báo tùy chỉnh. Bạn sẽ cần phải tự làm quen với các thông báo Android Wear ở đây:

Custom Notifications

Bài tập này là một chút dài vì vậy tôi sẽ cố gắng để được ngắn gọn nhưng súc tích.

1) Trước tiên, bạn sẽ cần xác định bố cục thông báo tùy chỉnh, xác định bố cục của thông báo trong tệp bố cục XML. Để lặp lại ví dụ của Google, xác định một layout XML chứa một ImageView cho bộ đếm thời gian tiến tròn và hai lĩnh vực văn bản cho các mô tả tập luyện:

<?xml version="1.0" encoding="utf-8"?> 
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" 
    android:layout_width="match_parent" 
    android:layout_height="match_parent" 
    android:orientation="horizontal"> 
    <ImageView 
    ... 
    </> 
    <RelativeLayout 
     android:layout_marginStart="20dp" 
     android:layout_width="match_parent" 
     android:layout_height="match_parent" 
     xmlns:android="http://schemas.android.com/apk/res/android"> 
     <TextView 
     ... 
     </> 
     <TextView 
     ... 
     </> 
    </RelativeLayout> 

2) Tạo một CircularTimer.class lớp mà kéo dài đối tượng vẽ API. Lớp này nên thực hiện một phương thức start() và stop() để xử lý đếm ngược của bộ đếm thời gian. API có thể rút ra nằm ngoài phạm vi của bài tập này nhưng bạn có thể tìm hiểu thêm bằng cách tìm kiếm trên thanh tiến trình trên web. Đối với ngắn gọn, đây là một ví dụ:

public class CircularTimer() extends Drawable { 
    ... 
    public CircularTimer(int maxValue) { ... } 

    @Override 
    public void onDraw(Canvas canvas) { 
     // Use drawCircle(), drawArc() to draw a circle and pie bar 
     // Use drawText to draw the timeout value in center of circle 
    } 
    ... 
} 

4) Tạo lớp học WorkoutCustomView.class và đặt chế độ xem nội dung thành XML được xác định trước đó của bạn. Nhận một tham chiếu của ImageView của bạn và thiết lập một đối tượng drawable cho phương thức setImageDrawable(). Ví dụ:

mImageView = (ImageView) findViewById(R.id.imageview); 
mCircularTimer = new CircularTimer(60); // 60s countdown 
mImageView.setImageDrawable(mCircularTimer); 

3) Cài đặt thông báo cơ bản của bạn:

NotificationCompat.Builder builder = new NotificationCompat.Builder(this) 
    .setContentTitle("Workout") 
    .setContentText("Push Ups") 
    .setSmallIcon(R.drawable.ic_bicep); 

4) Tạo một ý định và đang chờ giải ý định sẽ được đưa ra bởi các thông báo tùy chỉnh:

Intent i = new Intent(this, WorkoutCustomView.class); 
PendingIntent pi = PendingIntent.getActivity(this, 0, i, PendingIntent.FLAG_UPDATE_CURRENT); 

5) Đặt đối tượng mục đích đang chờ xử lý cho phương thức setDisplayIntent() của lớp WearableExtender:

NotificationCompat.WearableExtender we = new NotificationCompat.WearableExtender()  
.setDisplayIntent(pi); 

// Add wearable specific features 
builder.extend(wearableExtender); 

6) Công văn thông báo của bạn

NotificationManagerCompat notificationManager = 
NotificationManagerCompat.from(this); 
notificationManager.notify(NOTIFICATION_ID, builder.build()); 

Hope this helps!

Để đọc thêm, hãy kiểm tra http://www.learnandroidwear.com/wear-custom-notification. Tác giả thực sự đã thực hiện sao chép chính xác ví dụ của bạn.

Andrew