Значок счетчика уведомлений на панели действий (значок), как у Google
есть ли стандартный значок android или метод, чтобы показать значок уведомления панели действий с подсчетом, как на примерах Google?
Если нет, то каков наилучший способ сделать это?
Я новичок в Android, пожалуйста, помогите.
8 ответов:
Я не уверен, если это лучшее решение, или нет, но это то, что мне нужно.
Пожалуйста, скажите мне, если вы знаете, что нужно изменить для улучшения производительности или качества. В моем случае, у меня есть кнопка.
пользовательский пункт в моем меню-main.xml
<item android:id="@+id/badge" android:actionLayout="@layout/feed_update_count" android:icon="@drawable/shape_notification" android:showAsAction="always"> </item>
пользовательские формы 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="#22000000" android:width="2dp"/> <corners android:radius="5dp" /> <solid android:color="#CC0001"/> </shape>
макет для моего представления-feed_update_count.xml
<?xml version="1.0" encoding="utf-8"?> <Button xmlns:android="http://schemas.android.com/apk/res/android" android:id="@+id/notif_count" android:layout_width="wrap_content" android:layout_height="wrap_content" android:minWidth="32dp" android:minHeight="32dp" android:background="@drawable/shape_notification" android:text="0" android:textSize="16sp" android:textColor="@android:color/white" android:gravity="center" android:padding="2dp" android:singleLine="true"> </Button>
MainActivity-настройка и обновление мой взгляд
static Button notifCount; static int mNotifCount = 0; @Override public boolean onCreateOptionsMenu(Menu menu) { MenuInflater inflater = getSupportMenuInflater(); inflater.inflate(R.menu.main, menu); View count = menu.findItem(R.id.badge).getActionView(); notifCount = (Button) count.findViewById(R.id.notif_count); notifCount.setText(String.valueOf(mNotifCount)); return super.onCreateOptionsMenu(menu); } private void setNotifCount(int count){ mNotifCount = count; invalidateOptionsMenu(); }
Я просто поделюсь своим кодом, если кто-то хочет что-то вроде этого:
layout / menu / menu_actionbar.xml
<?xml version="1.0" encoding="utf-8"?> <menu xmlns:android="http://schemas.android.com/apk/res/android"> ... <item android:id="@+id/menu_hotlist" android:actionLayout="@layout/action_bar_notifitcation_icon" android:showAsAction="always" android:icon="@drawable/ic_bell" android:title="@string/hotlist" /> ... </menu>
layout / action_bar_notifitcation_icon.xml
Примечание стиль и android: clickable свойства. они делают макет размером с кнопку и делают фон серым, когда тронутый.
<?xml version="1.0" encoding="utf-8"?> <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="wrap_content" android:layout_height="fill_parent" android:orientation="vertical" android:gravity="center" android:layout_gravity="center" android:clickable="true" style="@android:style/Widget.ActionButton"> <ImageView android:id="@+id/hotlist_bell" android:src="@drawable/ic_bell" android:layout_width="wrap_content" android:layout_height="wrap_content" android:gravity="center" android:layout_margin="0dp" android:contentDescription="bell" /> <TextView xmlns:android="http://schemas.android.com/apk/res/android" android:id="@+id/hotlist_hot" android:layout_width="wrap_content" android:minWidth="17sp" android:textSize="12sp" android:textColor="#ffffffff" android:layout_height="wrap_content" android:gravity="center" android:text="@null" android:layout_alignTop="@id/hotlist_bell" android:layout_alignRight="@id/hotlist_bell" android:layout_marginRight="0dp" android:layout_marginTop="3dp" android:paddingBottom="1dp" android:paddingRight="4dp" android:paddingLeft="4dp" android:background="@drawable/rounded_square"/> </RelativeLayout>
drawable-xhdpi / ic_bell.png
изображение пиксела 64x64 с 10 прокладками пиксела широкими от всех сторон. Вы должны иметь 8-пиксельные широкие отступы, но я нахожу, что большинство элементов по умолчанию немного меньше. Конечно, вы захотите использовать разные размеры для разных плотностей.
drawable / rounded_square.xml
здесь, #ff222222 (цвет #222222 с Альфа #ff (полностью видимый)) - это цвет фона моей панели действий.
<?xml version="1.0" encoding="utf-8"?> <shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle"> <corners android:radius="2dp" /> <solid android:color="#ffff0000" /> <stroke android:color="#ff222222" android:width="2dp"/> </shape>
com/ubergeek42/WeechatAndroid / WeechatActivity.java
здесь мы делаем его кликабельным и обновляемым! Я создал абстрактный слушатель, который обеспечивает создание тостов на onLongClick, код был взят изисточники ActionBarSherlock.
private int hot_number = 0; private TextView ui_hot = null; @Override public boolean onCreateOptionsMenu(final Menu menu) { MenuInflater menuInflater = getSupportMenuInflater(); menuInflater.inflate(R.menu.menu_actionbar, menu); final View menu_hotlist = menu.findItem(R.id.menu_hotlist).getActionView(); ui_hot = (TextView) menu_hotlist.findViewById(R.id.hotlist_hot); updateHotCount(hot_number); new MyMenuItemStuffListener(menu_hotlist, "Show hot message") { @Override public void onClick(View v) { onHotlistSelected(); } }; return super.onCreateOptionsMenu(menu); } // call the updating code on the main thread, // so we can call this asynchronously public void updateHotCount(final int new_hot_number) { hot_number = new_hot_number; if (ui_hot == null) return; runOnUiThread(new Runnable() { @Override public void run() { if (new_hot_number == 0) ui_hot.setVisibility(View.INVISIBLE); else { ui_hot.setVisibility(View.VISIBLE); ui_hot.setText(Integer.toString(new_hot_number)); } } }); } static abstract class MyMenuItemStuffListener implements View.OnClickListener, View.OnLongClickListener { private String hint; private View view; MyMenuItemStuffListener(View view, String hint) { this.view = view; this.hint = hint; view.setOnClickListener(this); view.setOnLongClickListener(this); } @Override abstract public void onClick(View v); @Override public boolean onLongClick(View v) { final int[] screenPos = new int[2]; final Rect displayFrame = new Rect(); view.getLocationOnScreen(screenPos); view.getWindowVisibleDisplayFrame(displayFrame); final Context context = view.getContext(); final int width = view.getWidth(); final int height = view.getHeight(); final int midy = screenPos[1] + height / 2; final int screenWidth = context.getResources().getDisplayMetrics().widthPixels; Toast cheatSheet = Toast.makeText(context, hint, Toast.LENGTH_SHORT); if (midy < displayFrame.height()) { cheatSheet.setGravity(Gravity.TOP | Gravity.RIGHT, screenWidth - screenPos[0] - width / 2, height); } else { cheatSheet.setGravity(Gravity.BOTTOM | Gravity.CENTER_HORIZONTAL, 0, height); } cheatSheet.show(); return true; } }
добавить. Если кто-то хочет реализовать заполненный пузырь круга, вот код (назовите его
bage_circle.xml
):<shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="ring" android:useLevel="false" android:thickness="9dp" android:innerRadius="0dp" > <solid android:color="#F00" /> <stroke android:width="1dip" android:color="#FFF" /> <padding android:top="2dp" android:bottom="2dp"/> </shape>
вы можете отрегулировать толщину согласно вашей потребности.
EDIT: Вот макет для кнопки (назовите его
badge_layout.xml
):<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="wrap_content" android:layout_height="wrap_content"> <com.joanzapata.iconify.widget.IconButton android:layout_width="44dp" android:layout_height="44dp" android:textSize="24sp" android:textColor="@color/white" android:background="@drawable/action_bar_icon_bg" android:id="@+id/badge_icon_button"/> <TextView android:id="@+id/badge_textView" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_alignTop="@id/badge_icon_button" android:layout_alignRight="@id/badge_icon_button" android:layout_alignEnd="@id/badge_icon_button" android:text="10" android:paddingEnd="8dp" android:paddingRight="8dp" android:paddingLeft="8dp" android:gravity="center" android:textColor="#FFF" android:textSize="11sp" android:background="@drawable/badge_circle"/> </RelativeLayout>
в меню Создать пункт:
<item android:id="@+id/menu_messages" android:showAsAction="always" android:actionLayout="@layout/badge_layout"/>
на
onCreateOptionsMenu
получить ссылку на пункт меню:itemMessages = menu.findItem(R.id.menu_messages); badgeLayout = (RelativeLayout) itemMessages.getActionView(); itemMessagesBadgeTextView = (TextView) badgeLayout.findViewById(R.id.badge_textView); itemMessagesBadgeTextView.setVisibility(View.GONE); // initially hidden iconButtonMessages = (IconButton) badgeLayout.findViewById(R.id.badge_icon_button); iconButtonMessages.setText("{fa-envelope}"); iconButtonMessages.setTextColor(getResources().getColor(R.color.action_bar_icon_color_disabled)); iconButtonMessages.setOnClickListener(new View.OnClickListener() { @Override public void onClick(View view) { if (HJSession.getSession().getSessionId() != null) { Intent intent = new Intent(getThis(), HJActivityMessagesContexts.class); startActivityForResult(intent, HJRequestCodes.kHJRequestCodeActivityMessages.ordinal()); } else { showLoginActivity(); } } });
после получения уведомления для сообщений установите счетчик:
itemMessagesBadgeTextView.setText("" + count); itemMessagesBadgeTextView.setVisibility(View.VISIBLE); iconButtonMessages.setTextColor(getResources().getColor(R.color.white));
этот код использует Iconify-fontawesome.
compile 'com.joanzapata.iconify:android-iconify-fontawesome:2.1.+'
мне не нравится
ActionView
решения , моя идея:
- создать макет с
TextView
, чтоTextView
будут заполнены применениекогда вам нужно нарисовать
MenuItem
:2.1. надуть макет
2.2. звоните
measure()
&layout()
(иначеview
будет 0px x 0px, это слишком мало для большинства случаев использования)2.3. установите
TextView
' s text2.4. сделайте "скриншот" из посмотреть
2.6. набор
MenuItem
's значок на основе растрового изображения, созданного на 2.4профит!
так, результат должен быть что-то вроде
- создать макет вот простой пример
<?xml version="1.0" encoding="utf-8"?> <FrameLayout xmlns:android="http://schemas.android.com/apk/res/android" android:id="@+id/counterPanel" android:layout_width="32dp" android:layout_height="32dp" android:background="@drawable/ic_menu_gallery"> <RelativeLayout android:id="@+id/counterValuePanel" android:layout_width="wrap_content" android:layout_height="wrap_content" > <ImageView android:id="@+id/counterBackground" android:layout_width="wrap_content" android:layout_height="wrap_content" android:background="@drawable/unread_background" /> <TextView android:id="@+id/count" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="1" android:textSize="8sp" android:layout_centerInParent="true" android:textColor="#FFFFFF" /> </RelativeLayout> </FrameLayout>
@drawable/unread_background
заключается в том, что зеленыйTextView
's фон,@drawable/ic_menu_gallery
не требуется здесь, это просто для предварительного просмотра результата макета в ИНТЕГРИРОВАННАЯ СРЕДА РАЗРАБОТКИ.
добавить код в
onCreateOptionsMenu
/onPrepareOptionsMenu
@Override public boolean onCreateOptionsMenu(Menu menu) { getMenuInflater().inflate(R.menu.menu_main, menu); MenuItem menuItem = menu.findItem(R.id.testAction); menuItem.setIcon(buildCounterDrawable(count, R.drawable.ic_menu_gallery)); return true; }
реализовать build-the-icon метод:
private Drawable buildCounterDrawable(int count, int backgroundImageId) { LayoutInflater inflater = LayoutInflater.from(this); View view = inflater.inflate(R.layout.counter_menuitem_layout, null); view.setBackgroundResource(backgroundImageId); if (count == 0) { View counterTextPanel = view.findViewById(R.id.counterValuePanel); counterTextPanel.setVisibility(View.GONE); } else { TextView textView = (TextView) view.findViewById(R.id.count); textView.setText("" + count); } view.measure( View.MeasureSpec.makeMeasureSpec(0, View.MeasureSpec.UNSPECIFIED), View.MeasureSpec.makeMeasureSpec(0, View.MeasureSpec.UNSPECIFIED)); view.layout(0, 0, view.getMeasuredWidth(), view.getMeasuredHeight()); view.setDrawingCacheEnabled(true); view.setDrawingCacheQuality(View.DRAWING_CACHE_QUALITY_HIGH); Bitmap bitmap = Bitmap.createBitmap(view.getDrawingCache()); view.setDrawingCacheEnabled(false); return new BitmapDrawable(getResources(), bitmap); }
полный код здесь:https://github.com/cvoronin/ActionBarMenuItemCounter
ОК, для @AndrewS решение для работы с В7-библиотека совместимости приложений:
<menu xmlns:android="http://schemas.android.com/apk/res/android" xmlns:someNamespace="http://schemas.android.com/apk/res-auto" > <item android:id="@+id/saved_badge" someNamespace:showAsAction="always" android:icon="@drawable/shape_notification" /> </menu>
.
@Override public void onCreateOptionsMenu(Menu menu, MenuInflater inflater) { super.onCreateOptionsMenu(menu, inflater); menu.clear(); inflater.inflate(R.menu.main, menu); MenuItem item = menu.findItem(R.id.saved_badge); MenuItemCompat.setActionView(item, R.layout.feed_update_count); View view = MenuItemCompat.getActionView(item); notifCount = (Button)view.findViewById(R.id.notif_count); notifCount.setText(String.valueOf(mNotifCount)); } private void setNotifCount(int count){ mNotifCount = count; supportInvalidateOptionsMenu(); }
остальная часть кода такая же.
попробуйте посмотреть на ответы на эти вопросы, особенно второй, который имеет пример кода:
как реализовать динамические значения на пункт меню В Android
как получить текст на значок панели действий?
из того, что я вижу, вам нужно будет создать свой собственный
ActionView
реализация. Альтернативой может быть заказDrawable
. Обратите внимание, что, по-видимому, нет собственной реализации подсчета уведомлений для Панель Действий.EDIT: ответ, который вы искали, с кодом: Пользовательский Вид Уведомления С пример реализации
при использовании панели инструментов:
.... private void InitToolbar() { toolbar = (Toolbar) findViewById(R.id.my_awesome_toolbar); toolbartitle = (TextView) findViewById(R.id.titletool); toolbar.inflateMenu(R.menu.show_post); toolbar.setOnMenuItemClickListener(this); Menu menu = toolbar.getMenu(); MenuItem menu_comments = menu.findItem(R.id.action_comments); MenuItemCompat .setActionView(menu_comments, R.layout.menu_commentscount); View v = MenuItemCompat.getActionView(menu_comments); v.setOnClickListener(new OnClickListener() { @Override public void onClick(View arg0) { // Your Action } }); comment_count = (TextView) v.findViewById(R.id.count); }
и в вашей загрузке данных вызовите refreshMenu ():
private void refreshMenu() { comment_count.setVisibility(View.VISIBLE); comment_count.setText("" + post_data.getComment_count()); }
вместо управления пользовательской формы и drawable почему бы не использовать встроенный механизм Android? Вы можете использовать стиль значка в
TextView
и использовать пользовательский стиль в вашей теме.Ура. :)
<TextView android:id="@+id/fabCounter" style="@style/Widget.Design.FloatingActionButton" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_alignParentEnd="true" android:layout_centerVertical="true" android:layout_marginEnd="10dp" android:padding="5dp" android:text="10" android:textColor="@android:color/black" android:textSize="14sp" />