Trợ giúp giao diện người dùng cho Thông báo trên biểu tượng

Question

Tôi muốn thiết kế giao diện người dùng sau. Ai có thể cho tôi một ví dụ hoặc đề xuất một số mã nguồn để thực hiện?

Answer 1

Here is Project on Git Hub về thấy phù hiệu vào các mặt hàng khác nhau, nhưng bên trong ứng dụng của bạn (tức TextView, TabHost, ImageView vv)

Về hiển thị huy hiệu trên biểu tượng ứng dụng, điều này là không thể, bởi vì đây không phải là cách android hiển thị thông báo. Khung android hỗ trợ xử lý thông báo bằng cách sử dụng Status bar Notifications

Answer 2

Bạn có thể sử dụng một RelativeLayout với hai đứa con, một cho biểu tượng và một cho các huy hiệu. Biểu tượng cần thêm phần đệm để huy hiệu hơi nằm ngoài nó. Huy hiệu được đặt thẳng hàng với parentTop và parentRight.

Answer 3

Nếu bạn muốn thiết lập các biểu tượng thông báo ở góc trên cùng bên trái nó cũng đơn giản như những mảnh tiếp theo của mã:

Bitmap1 phải lớn hơn bitmap2, và trong trường hợp của bạn tôi sẽ tư vấn cho nó để là hình ảnh PNG có nền trong suốt để cho phép bong bóng thông báo nằm ngoài phần còn lại của hình ảnh.

 private Bitmap overlay(Bitmap bitmap1, Bitmap bitmap2) { 
      Bitmap bmOverlay = Bitmap.createBitmap(bitmap1.getWidth(), bitmap1.getHeight(), bitmap1.getConfig()); 
      Canvas canvas = new Canvas(bmOverlay); 
      canvas.drawBitmap(bitmap1, new Matrix(), null); 
      canvas.drawBitmap(bitmap2, new Matrix(), null); 
      return bmOverlay; 
     } 

Nếu không, nếu bạn muốn ở góc trên bên phải, bạn nên thử bất kỳ thông số kỹ thuật nào khác cho Canvas.drawBitmap.

Ví dụ:

canvas.drawBitmap(Bitmap bitmap, float left, float top, Paint paint); 

Hãy thử làm một cái gì đó như:

private Bitmap overlay(Bitmap bitmap1, Bitmap bitmap2) { 
      Bitmap bmOverlay = Bitmap.createBitmap(bitmap1.getWidth(), bitmap1.getHeight(), bitmap1.getConfig()); 
      Canvas canvas = new Canvas(bmOverlay); 
      canvas.drawBitmap(bitmap1, new Matrix(), null); 
      canvas.drawBitmap(bitmap2, bitmap1.getWidth()-bitmap2.getWidth(), 
           0,null); 
      return bmOverlay; 
     } 

Nếu tất cả các bạn muốn là làm thế nào để làm điều đó trên XML, sau đó bạn nên tạo một RelativeLayout và sau đó vào nó thêm cả hình ảnh và căn chỉnh bong bóng thông báo ở bên phải. Và điều đó sẽ làm được điều đó. Bạn sẽ vẫn phải có một hình ảnh PNG với nền trong suốt.

Tôi hy vọng điều đó là đủ cho những gì bạn muốn làm.

Answer 4

Đây là mã nguồn của bạn cho màn hình hiển thị biểu tượng tiện ích con biểu tượng tiện ích ứng dụng này.

<?xml version="1.0" encoding="utf-8"?> 
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" 
android:id="@+id/main_widget" 
android:layout_width="wrap_content" 
android:layout_height="wrap_content" 
android:layout_gravity="center_horizontal" 
android:layout_marginTop="20dip" 
android:focusable="true" > 

<ImageView 
    android:id="@+id/icon" 
    android:layout_width="60dip" 
    android:layout_height="60dip" 
    android:layout_marginTop="8dp" 
    android:background="@drawable/logo" 
    android:contentDescription="image" 
    android:scaleType="center" /> 

<TextView 
    android:id="@+id/title" 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    android:layout_below="@+id/icon" 
    android:gravity="center" 
    android:paddingLeft="3dp" 
    android:paddingTop="10dp" 
    android:shadowColor="#000000" 
    android:shadowDx="1" 
    android:shadowDy="1" 
    android:shadowRadius="1.5" 
    android:text="@string/app_name" 
    android:textColor="#FFF" /> 

<TextView 
    android:id="@+id/txt_count" 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    android:layout_marginLeft="-10dip" 
    android:layout_toRightOf="@+id/icon" 
    android:background="@drawable/badge_count2" 
    android:contentDescription="badge" 
    android:gravity="center" 
    android:text="1" 
    android:textColor="@color/White" 
    android:textStyle="bold" /> 

</RelativeLayout> 

và bạn cũng cần tệp badge_count2.xml drawable này.

<shape xmlns:android="http://schemas.android.com/apk/res/android" 
android:shape="rectangle" > 

<solid android:color="@color/red" > 
</solid> 

<stroke 
    android:width="2dp" 
    android:color="#FFFFFF" > 
</stroke> 

<padding 
    android:bottom="2dp" 
    android:left="7dp" 
    android:right="7dp" 
    android:top="3dp" /> 

<corners android:radius="10dp" > 
</corners> 

Answer 5

đây là một thư viện có sẵn hỗ trợ đơn giản trong nhiều thiết bị như sony, samsung, moto vv ... thử này ... điều này sẽ làm việc ... tôi đã cố gắng và đang làm việc tốt .. . http://github.com/leolin310148/ShortcutBadger