2012-01-27 56 views
12

Tôi muốn tạo chế độ xem biểu tượng thông báo trông giống như thông báo của ứng dụng Google+. Sự khác biệt sẽ là tôi cần để có thể thay đổi màu sắc trong thời gian chạy khi mà các biểu tượng Google+ màu xám hoặc đỏ vì vậy tôi giả định rằng họ đang sử dụng một StateListDrawable.Chế độ xem thông báo tùy chỉnh

Cách tiếp cận tốt nhất cho việc này là gì? Tôi muốn có các góc bị cắt tròn và có tùy chọn để có một bên trong có thể kéo được. Chế độ xem tùy chỉnh này cũng sẽ được đặt trong Thanh tác vụ. Tôi vẫn cần chế độ xem để phản hồi android: danh sách trạng thái nền có thể vẽ để tôi có thể nhấp và chọn làm việc phù hợp.

Chế độ xem tùy chỉnh này cũng sẽ được đặt trong thanh tác vụ.

Google+ app with the notification icon in the upper right that's grayed out and has a 0 in the middle.

+0

Bạn có biết làm thế nào để làm điều đó như Google không, mà không cần chỉnh? – AndrewS

Trả lời

23

Tôi đã giải quyết vấn đề này bằng cách làm như sau.

Tạo mục này để làm cho hình dạng góc tròn có màu đồng nhất. Điều này cũng cho biết thêm một màu đen mờ để cung cấp cho nó một cái nhìn ấn tượng chống lại một blackground. res/drawable/shape_notification.xml

<?xml version="1.0" encoding="utf-8"?> 
<shape xmlns:android="http://schemas.android.com/apk/res/android" 
    android:shape="rectangle"> 
    <stroke android:color="#33000000" android:width="2dp"/> 
    <corners android:radius="4dp" /> 
    <solid android:color="#99333333"/> 
</shape> 

Lớp drawable sẽ được sử dụng như là drawable thực tế vào mục thanh hành động. Nó có nền (được viết ở trên) được phủ bằng biểu tượng cờ lê. res/drawable/layer_customizer.xml

<?xml version="1.0" encoding="utf-8"?> 
<layer-list xmlns:android="http://schemas.android.com/apk/res/android" > 
    <item android:drawable="@drawable/shape_notification" /> 
    <item android:drawable="@drawable/ic_menu_preferences" /> 
</layer-list> 

mã Java để thay đổi màu sắc. Khung nhìn đích là đối tượng được gán cho lớp_customizer có thể vẽ được. Màu được chuyển vào sẽ thay đổi màu thẻ rắn của shape_notification.xml.

public static void setCustomizerDrawableColor(final View target, final int color) { 
    final Drawable d = target.getDrawable(); 
    LayerDrawable layer = (LayerDrawable)d; 
    GradientDrawable gradient = (GradientDrawable)layer.getDrawable(0); 
    gradient.setColor(color); 
    gradient.invalidateSelf(); 
    layer.invalidateSelf(); 
    target.invalidate(); 
} 

Tạo bố cục bằng các lớp này. res/layout/actionview_customizer.xml

<?xml version="1.0" encoding="utf-8"?> 
<ImageButton xmlns:android="http://schemas.android.com/apk/res/android" 
    android:layout_width="match_parent" 
    android:layout_height="match_parent" 
    android:id="@+id/ActionViewCustomizer" 
    android:src="@drawable/layer_customizer" 
    android:contentDescription="@string/customize" 
    style="@style/ActionBarButton" /> 

Để có được bố trí tùy chỉnh để đưa vào ActionBar thêm mục trình đơn này vào nó: res/menu/actionbar_main.xml

<item android:id="@+id/MenuItemCustomize" 
    android:icon="@drawable/layer_customizer" 
    android:title="@string/customize" 
    android:showAsAction="always" 
    android:actionLayout="@layout/actionview_customizer" 
    /> 

Sau đó, sau khi tải Thanh Hành động, hãy sử dụng mã này để xử lý nút. Điều này xảy ra trong Hoạt động của bạn.

@Override 
public boolean onCreateOptionsMenu(Menu menu) { 
    getMenuInflater().inflate(R.menu.actionbar_main, menu); 
    final ActionBar actionBar = getActionBar(); 
    final MenuItem customizerItem = menu.findItem(R.id.MenuItemCustomize); 
    View v = customizerItem.getActionView(); 
    customizerActionView = (ImageButton) v; 
    customizerActionView.setOnClickListener(new OnClickListener() { 
     public void onClick(View v) { 
      onOptionsItemSelected(customizerItem); 
     } 
    }); 
} 

Nếu bạn muốn xem nguồn đầy đủ làm việc cùng nhau nhìn vào mã nguồn ứng dụng Tôi sử dụng này trong. http://code.google.com/p/motivatormaker-android/source/browse/MakeMotivator/src/com/futonredemption/makemotivator/activities/MainActivity.java

+0

Làm cách nào để bạn có được Chế độ xem trong ActionBar (mục tiêu)? –

+0

Bây giờ bạn nên khỏe. :) –

+0

hãy giúp tôi - cách hiển thị số, chứ không phải biểu tượng như trong ví dụ của bạn ()? – AndrewS

Các vấn đề liên quan