Popupmenu android studio kotlin

PopupMenu — Всплывающее меню

Начиная с Android 3.0, в системе появилась возможность создавать всплывающее меню, привязанное к элементу View. Меню реализовано в виде модального окна, которое отображается снизу от родителя меню или в другом месте, если места снизу недостаточно. PopupMenu не нужно путать с контекстным меню. У них разные задачи, хотя поведение весьма схоже. В новых версиях Android использование всплывающих меню предпочтительнее контекстных, которые можно считать устаревшим интерфейсом.

В Android 4.0 добавили новую функциональность, чтобы работать было проще. В частности, всплывающее меню можно получить из XML-файла, используя метод inflate(int), которому следует передать идентификатор ресурса меню. А до этого приходилось использовать отдельный класс MenuInflator с избыточным кодом.

Также появился слушатель PopupMenu.OnDismissListener для работы с закрытием меню. Он срабатывает либо, когда пользователь щёлкает на пункте меню и меню закрывается, либо пользователь щёлкает в другом месте экрана, и меню также закрывается.

Есть момент, который приводит к конфузу. Сейчас существует два класса с одинаковым именем из двух разных пакетов: android.widget и androidx.appcompat.widget (ещё были android.support.v7.widget.PopupMenu и android.support.v4.widget.PopupMenuCompat). Они практически одинаковы в применении, но в паре моментов поведение отличается.

Например, всплывающее меню из AndroidX может быть прокручиваемым. Когда я щёлкал на изображении, то на экран выводилось только два пункта, и для третьего пункта приходилось прокручивать меню.

Создать всплывающее меню очень просто. По сути мы повторяем шаги по созданию обычного меню. Сначала в ресурсах меню создадим нужный файл:

res/menu/popupmenu.xml

Я постарался использовать всевозможные варианты использования атрибутов, которые отвечают за вывод флажков, доступность и т.д. Есть и другие атрибуты, о которых читайте в документации.

Далее добавим на экран активности текстовую метку, кнопку и ImageView. При щелчке на каждом из этих компонентов мы будем выводить одинаковое всплывающее меню:

Осталось написать код.

Вам надо создать новый экземпляр PopupMenu, указав контекст активности и компонент, к которому будет привязано это меню. Далее загружаете меню из ресурсов и добавляете методы для обработки щелчков. Для отображения на экране вызывается метод show().

Запустив проект, вы можете щёлкать по любому элементу на форме и увидеть всплывающее меню.

Несмотря на то, что в XML мы указали значки, в реальности они не выводятся. В интернете можно найти примеры решения проблемы через программный код. В Android Q (API 29) можно сделать из коробки (см. пример ниже).

Меню со значками (Kotlin)

Напишем другой вариант примера на Kotlin и заставим систему выводить значки. Будем вызывать меню при нажатии на кнопку и выводить информацию в TextView через новый объект popupMenu2 из пакета android.widget, у которого есть специальный метод setForceShowIcon() для вывода значков на экран. И для сравнения оставим код из предыдущего примера.

Создадим новый файл меню res/menu/popup_menu.xml для второго примера.

Программное добавление пунктов

Повесим на новую кнопку возможность программного добавления новых пунктов меню.

Источник

Popupwindow Android example in Kotlin

Popupwindow is a floating view that is displayed on top of an activity. Android provides a PopupWindow class for creating a popup window with the custom design.

It is present from the first versions of the API, but not as popular as other dialog boxes due to the need for additional configuration, which is not always necessary.

Android PopupWindow very useful when you want to show the dialog just over the view items. For Example you can able to show the dialog near to the more option of your cardview / button view.

Check out my popup window android example demo.

Now we are going to create popup window showed in the popupwindow example video.

1. Adding Dependencies

In this example, we are going to show list of items in the recyclerview. So, we need recyclerview and cardview dependencies.

I have explained about using recyclerview and cardview in separate post. Please check it in the links.

2. Create PopupWindow Layouts

As mentioned in the design, First we need to create popupWindow layout with recyclerview.

Recyclerview need a adapter view to hold the popup items. So, we need to create adapter layout file.

3. Implement PopupWindow With Data

We are using recyclerview in the popup window. so, we need model class to hold the data.

Also, we need to create adpater to set popup items.

In the Adapter, set the click listener interface for the popup window click callbacks.

Already, we have created layouts and adapter for the PopupWindows. Lets create the PopupWindow.

In the above code, I am using adapter.setOnClick to pass the implementation of the RecyclerviewCallbacks interface to receive the callbacks of the popup window items.

4. Show / Hide the PopupWindow

Now, our popup window is ready to display. So, whenever we need to show the popup window. call the below code.

To dismiss the popup window,

That’s it. Now we can able to show and hide the popup window in android.

Download the example code from Github.

Thanks for reading.

Please try this with example and let me know your feedback in comments.

Источник

Android Menu Using Kotlin

Android Tutorial

Kotlin Tutorial

In this tutorial, we’ll be discussing and implement the Android Menu class in our android application using Kotlin.
We’ll see the different ways in which Menus can be displayed on the screen.

Android Menu

Menus are a UI component that is used to display a list of options to perform a quick action.
Menus in Android are largely divided into three different types:

• Options Menu – These are the most common form of menus. They’re typically displayed in the Toolbar.
• Context Menu – These are floating menus that are displayed when a user long clicks on the widget that’s ought to show the Menu
• Popup Menu – These are displayed on the anchor point above or below the widget that is clicked.

Android Menus can be defined inside the resources folder.
Every menu is associated with an icon and a title along with an attribute: showAsAction .
android:orderInCategory attribute is used to set the order of the menu items in the menu. The highest order occupies the leftmost position. It accepts an integer value.

In the following section, we’ll be creating an Android Application Using Kotlin which will cover each of these menu types.

Project Structure

In the res folder create a new resource directory to hold menus.
In the new menu folder that gets created, create a menu resource layout file:

The code for the menu_main.xml menu file is given below:

ifRoom value indicates to show the menu icon only if there is space. This priority is the second lowest.
never value indicates that menu icon would not be shown at all in the Toolbar/Menu layout. It’ll reside in the overflow menu.
always indicates that the menu icon.
withText indicates that the menu text would be displayed.

We can club any two of the above values(clubbing never value doesn’t make sense!)

The code for the popup_menu.xml menu file is given below:

Menu Items can be grouped too. We can add a checkable behavior on the groups:
popup_menu_group.xml

The code for the activity_main.xml layout file is given below:

For the Options Menu two methods namely: onCreateOptionsMenu and onOptionsItemSelected need to be overridden. In the onCreateOptionsMenu we inflate the XML menu using the MenuInflater class.

ContextMenu is triggered on a particular view. We need to call registerForContextMenu on that view. This triggers onCreateContextMenu where we add MenuItems in the menu list.
onContextItemSelected is triggered when any ContextMenu is selected.

PopupMenu is created when any view is clicked. The PopMenu gets initialized there itself by inflating the menu resource file using the menuInflater . To display the PopupMenu we call the function show on the instance of it.

The code for the MainActivity.kt class is given below:

In the onCreateContextMenu : menu?.add(1, v?.id. 0, «Search») is used to add a new menu in the Context Menu.
The first param is the groupId. We can thus have different menu groups within a menu. The second is the menu item id. The third is the priority and the fourth is the title.

The output of the above application in action is given below:

This brings an end to this tutorial. You can download the project from the link below:

Источник

Popup Menu (with Icons!) – Android Kotlin Tutorial (Code)

Trending Tutorials

Learn how to create a popup menu with icons in this Kotlin Android tutorial!

You will learn how to create a menu resource, how to code the popup menu and then how to show icons in the popup menu. It’s a bit trickier than it may seem!

This post contains all the code that’s been written in this YouTube video.

You can also check out this GitHub repository: https://github.com/ResoCoder/PopupMenuTutorial

MainActivity.kt

menu_main.xml

activity_main.xml

About the author

Matt Rešetár

Matt is an app developer with a knack for teaching others. Working as a Flutter freelancer and most importantly developer educator, he doesn’t have a lot of free time 😅 Yet he still manages to squeeze in tough workouts 💪

You may also like

Create Responsive Flutter Apps with Minimal Effort

Flutter Bottom Navigation with Nested Routing

Flutter AdMob Monetization – Banner and Interstitial Ads

Thanks so much for contributing to the coding ecosystem. Your video was incredibly well done, you are well spoken and go at a very good pace for the complexity of the work you are doing. I also think using YouTube as the system of delivery is good as people can go through the material at their own pace.

Again thank you.

I’m extremely happy that I could help you. Thanks.

Thank you. Nice guide.

Reso Coder is the place for your professional growth as a developer. Learn from project-based tutorials that are not afraid to cover important, yet often overlooked, topics such as good code architecture, testing and even deployment.

Join 15,000+ growth-oriented Flutter developers subscribed to the newsletter who receive weekly Flutter news and resources.

© 2021 Reso Coder Labs s.r.o.

Please log in again. The login page will open in a new tab. After logging in you can close it and return to this page.

Hey! We are required to tell you that we use cookies to enhance your experience.

You can find out more about which cookies we are using or switch them off in settings .

Strictly Necessary Cookies

This website uses cookies so that we can provide you with the best user experience possible. Cookie information is stored in your browser and performs functions such as recognising you when you return to our website and helping our team to understand which sections of the website you find most interesting and useful.

Strictly Necessary Cookie should be enabled at all times so that we can save your preferences for cookie settings.

If you disable this cookie, we will not be able to save your preferences. This means that every time you visit this website you will need to enable or disable cookies again.

Источник

Современная Android разработка на Kotlin. Часть 1

Данная статья является перевом статьи от Mladen Rakonjac

Очень сложно найти один проект, который охватывал бы всё новое в разработке под Android в Android Studio 3.0, поэтому я решил написать его. В этой статье мы разберём следующее:

1. Android Studio 3
2. Язык программирования Kotlin
3. Варианты сборки
4. ConstraintLayout
5. Библиотека привязки данных Data Binding
6. Архитектура MVVM + паттерн repository (с mapper’ами) + Android Manager Wrappers
7. RxJava2 и как это помогает нам в архитектуре
8. Dagger 2.11, что такое внедрение зависимости, почему вы должны использовать это.
9. Retrofit (Rx Java2)
10. Room (Rx Java2)

Каким будет наше приложение?

Наше приложение будет самым простым, которое охватывает все перечисленные выше вещи: у него будет только одна функция, которая извлекает все репозитории пользователя googlesamples из GitHub, сохраняет эти данные в локальной базе данных и показывает их пользователю.

Я попытаюсь объяснить как можно больше строк кода. Вы всегда можете посмотреть код, который я опубликовал на GitHub.

Android Studio

Чтобы установить Android Studio 3, перейдите на эту страницу

Android Studio 3 поддерживает Kotlin. Откройте Create Android Project. Там вы увидите новый флажок с меткой Include Kotlin support. Он выбран по умолчанию. Дважды нажмите кнопку Далее и выберите Empty Activity, затем нажмите Finish.

Поздравляю! Вы сделали первое приложение для Android на Котлине 🙂

Kotlin

Вы можете видеть MainActivity.kt:

Расширение .kt означает, что файл является файлом Kotlin.

MainActivity: AppCompatActivity() означает, что мы расширяем AppCompatActivity.

Кроме того, все методы должны иметь ключевое слово fun и в Котлине вам не нужно использовать ;, но вы можете, если хотите. Вы должны использовать ключевое слово override, а не аннотацию, как в Java.

Так что же означает ? в savedInstanceState: Bundle?? Это означает, что savedInstanceState может быть типа Bundle или типа null. Kotlin null безопасный язык. Если у вас есть:

вы получите ошибку компиляции, потому что a должна быть инициализированна и это не может быть null. Это означает, что вы должны написать:

Кроме того, вы получите ошибку компиляции, если вы это сделаете:

Чтобы сделать a nullable, вы должны написать:

Почему эта важная особенность языка Котлина? Это помогает нам избежать NPE. Разработчики Android уже устали от NPE. Даже создатель null, сэр Тони Хоар, извинился за изобретение. Предположим, что мы имеем nullable nameTextView. Если переменная равна null, то в следующем коде мы получим NPE:

Но Котлин, на самом деле, хорош, он не позволят нам делать даже такое. Он заставляет нас использовать оператор ? или оператор !!. Если мы используем оператор ?:

Строка будет исполнена только если nameTextView не null. В ином случае, если вы используете оператор !!:

Мы получим NPE если nameTextView null. Это для авантюристов :).
Это было небольшое введение в Kotlin. Когда мы продолжим, я остановлюсь, чтобы описать другой специфический код на Котлине.

2. Build Variants

В разработке часто вы имеете различные окружения. Наиболее стандартным является тестовое и производственное окружение. Эти среды могут отличаться в URL-адресах сервера, иконке, имени, целевом API и т.д. На fleka в каждом проекте у вас есть:

• finalProduction, который отправляется в Google Play Store.
• demoProduction, то есть версия с URL-адресом production сервера с новыми функциями, которые всё ещё не находятся в Google Play Store. Наши клиенты могут установить эту версию рядом с Google Play, чтобы они могли протестировать ее и дать нам обратную связь.
• demoTesting, то же самое, что и demoProduction с тестовым URL-адресом сервера.
• mock, полезен для меня как для разработчика и дизайнера. Иногда у нас есть готовый дизайн, и наш API ещё не готов. Ожидание API, чтобы быть начать разработку — не решение. Этот вариант сборки снабжён поддельными данными, поэтому команда дизайнеров может проверить его и дать нам обратную связь. Очень полезно это не откладывать. Когда API уже готов, мы перемещаем нашу разработку в окружение demoTesting.

В этом приложении мы будем использовать всех их. У них будут отличаться applicationId и имена. В gradle 3.0.0 есть новый API flavorDimension, который позволяет смешивать разновидности продукта, так, например, вы можете смешать разновидности demo и minApi23. В нашем приложении мы будем использовать только «default» flavorDimension. Перейдите в build.gradle для приложения и вставьте этот код внутри android <>

Перейдите в strings.xml и удалите строку app_name, чтобы у нас не было конфликтов. Затем нажмите Sync Now. Если вы перейдете в Build Variants, расположенным слева от экрана, вы увидите 4 варианта сборки, каждый из которых имеет два типа сборки: Debug и Release. Перейдите к варианту сборки demoProduction и запустите его. Затем переключитесь на другой и запустите его. Вы должны увидеть два приложения с разными именами.

3. ConstraintLayout

Если вы откроете activity_main.xml, вы увидите, что этот layout — ConstrainLayout. Если вы когда-либо писали приложение под iOS, вы знаете об AutoLayout. ConstraintLayout действительно похож на него. Они даже используют один и тот же алгоритм Cassowary.

Constraint помогает нам описать связи между View. Для каждого View у вас должно быть 4 Constraint, один для каждой стороны. В данном случае наш View ограничен родителем с каждой стороны.

Если вы передвинете TextView «Hello World» немного вверх во вкладке Design, во вкладке Text появится новая линия:

Вкладки Design и Text синхронизируются. Наши изменения во вкладке Design влияют на xml во вкладке Text и наоборот. Vertical_bias описывает вертикальную тенденцию view его Constraint. Если вы хотите центровать вертикально, используйте:

Давайте сделаем чтобы наш Activity показал только один репозиторий. В нём будут имя репозитория, количество звезд, владелец, и он будет показывать, есть ли у репозитория issues, или нет.

Чтобы получить такой layout, xml должен выглядеть так:

Пусть tools:text вас не смущает. Он просто помогает нам видеть хороший предварительный просмотр макета (layout’а).

Вы можете заметить, что наш макет плоский, ровный. Вложенных макетов нет. Вы должны использовать вложенные макеты как можно реже, поскольку это может повлиять на производительность. Более подробную информацию об этом вы можете найти здесь. Кроме того, ConstraintLayout отлично работает с разными размерами экрана:

и мне кажется, что я могу добиться желаемого результата очень быстро.
Это было небольшое введение в ConstraintLayout. Вы можете найти Google code lab здесь, и документацию о ConstraintLayout на GitHub.

4. Библиотека привязки данных Data Binding

Когда я услышал о библиотеке привязки данных, первое вопрос, который я задал себе: «ButterKnife работает очень хорошо для меня. Кроме того, я использую плагин, который помогает мне получать View из xml. Зачем мне это менять?». Как только я узнал больше о привязке данных, у меня было такое же чувство, какое у меня было, когда я впервые использовал ButterKnife.

Как ButterKnife помогает нам?

ButterKnife помогает нам избавиться от скучного findViewById. Итак, если у вас 5 View, без Butterknife у вас есть 5 + 5 строк, чтобы привязать ваши View. С ButterKnife у вас есть 5 строк. Вот и всё.

Что плохо в ButterKnife?

ButterKnife по-прежнему не решает проблему поддержки кода. Когда я использовал ButterKnife, я часто получал исключение во время выполнения, потому что я удалял View в xml, и не удалял код привязки в классе Activity / Fragment. Кроме того, если вы хотите добавить View в xml, вам нужно снова сделать привязку. Это очень скучно. Вы теряете время на поддерживание связей.

Что насчёт библиотеки привязки данных?

Есть много преимуществ! С помощью библиотеки привязки данных вы можете привязать свои View всего одной строкой кода! Позвольте мне показать вам, как это работает. Давайте добавим библиотеку Data Binding в наш проект:

Обратите внимание, что версия компилятора Data Binding должна совпадать с версией gradle в файле build.gradle проекта:

Нажмите Sync Now. Перейдите в activity_main.xml и оберните ConstraintLayout тегом layout:

Обратите внимание, что вам нужно переместить все xmlns в тег layout. Затем нажмите иконку Build или используйте сочетание клавиш Ctrl + F9 (Cmd + F9 на Mac). Нам нужно собрать проект, чтобы библиотека Data Binding могла сгенерировать класс ActivityMainBinding, который мы будем использовать в нашем классе MainActivity.

Если вы не выполните сборку проекта, вы не увидите класс ActivityMainBinding, потому что он генерируется во время компиляции. Мы все еще не закончили связывание, мы просто сказали, что у нас есть ненулевая переменная типа ActivityMainBinding. Кроме того, как вы можете заметить, я не указал ? в конце типа ActivityMainBinding, и я не инициализировал его. Как это возможно? Модификатор lateinit позволяет нам иметь ненулевые переменные, ожидающие инициализации. Подобно ButterKnife, инициализация привязки должна выполняться в методе onCreate, когда ваш Activity будет готов. Кроме того, вы не должны объявлять привязку в методе onCreate, потому что вы, вероятно, используете его вне области видимости метода onCreate. Наша привязка не должна быть нулевой, поэтому мы используем lateinit. Используя модификатор lateinit, нам не нужно проверять привязку переменной каждый раз, когда мы обращаемся к ней.

Давайте инициализируем нашу переменную binding. Вы должны заменить:

Вот и всё! Вы успешно привязали свои View. Теперь вы можете получить к ним доступ и применить изменения. Например, давайте изменим имя репозитория на «Modern Android Habrahabr Article»:

Как вы можете видеть, мы можем получить доступ ко всем View (у которых есть id, конечно) из activity_main.xml через переменную binding. Вот почему Data Binding лучше, чем ButterKnife.

Getter’ы и Setter’ы в Котлине

Возможно, вы уже заметили, что у нас нет метода .setText (), как в Java. Я хотел бы остановиться здесь, чтобы объяснить, как геттеры и сеттеры работают в Kotlin по сравнению с Java.

Во-первых, вы должны знать, почему мы используем сеттеры и геттеры. Мы используем их, чтобы скрыть переменные класса и разрешить доступ только с помощью методов, чтобы мы могли скрыть элементы класса от клиентов класса и запретить тем же клиентам напрямую изменять наш класс. Предположим, что у нас есть класс Square в Java:

Используя метод setA (), мы запрещаем клиентам класса устанавливать отрицательное значение стороне квадрата, оно не должно быть отрицательным. Используя этот подход, мы должны сделать a приватным, поэтому его нельзя установить напрямую. Это также означает, что клиент нашего класса не может получить a напрямую, поэтому мы должны предоставить getter. Этот getter возвращает a. Если у вас есть 10 переменных с аналогичными требованиями, вам необходимо предоставить 10 геттеров. Написание таких строк — это скучная вещь, в которой мы обычно не используем наш разум.

Kotlin облегчает жизнь нашего разработчика. Если вы вызываете

это не означает, что вы получаете доступ к a непосредственно. Это то же самое, что

в Java. Причина заключается в том, что Kotlin автоматически генерирует геттеры и сеттеры по умолчанию. В Котлине, вы должны указать специальный сеттер или геттер, только если он у вас есть. В противном случае, Kotlin автогенерирует его для вас:

field? Что это? Чтобы было ясно, давайте посмотрим на этот код:

Это означает, что вы вызываете метод set внутри метода set, потому что нет прямого доступа к свойству в мире Kotlin. Это создаст бесконечную рекурсию. Когда вы вызываете a = что-то, он автоматически вызывает метод set.
Надеюсь, теперь понятно, почему вы должны использовать ключевое слово field и как работают сеттеры и геттеры.

Вернемся к нашему коду. Я хотел бы показать вам ещё одну замечательную особенность языка Kotlin, apply:

apply позволяет вам вызывать несколько методов на одном экземпляре.

Мы все еще не закончили привязку данных, есть ещё много дел. Давайте создадим класс модели пользовательского интерфейса для репозитория (этот класс модели пользовательского интерфейса для репозитория GitHub хранит данные, которые должны отображаться, не путайте их с паттерном Repository). Чтобы сделать класс Kotlin, вы должны перейти в New -> Kotlin File / Class:

В Kotlin первичный конструктор является частью заголовка класса. Если вы не хотите предоставлять второй конструктор, это всё! Ваша работа по созданию класса завершена здесь. Нет параметров конструктора для назначений полей, нет геттеров и сеттеров. Целый класс в одной строке!

Вернитесь в класс MainActivity.kt и создайте экземпляр класса Repository:

Как вы можете заметить, для построения объекта не нужно ключевого слова new.

Теперь перейдем к activity_main.xml и добавим тег data:

Мы можем получить доступ к переменной repository, которая является типом Repository в нашем макете. Например, мы можем сделать следующее в TextView с идентификатором repository_name:

В TextView repository_name будет отображаться текст, полученный из свойства repositoryName переменной repository. Остается только связать переменную репозитория от xml до repository из MainActivity.kt.
Нажмите Build, чтобы сгенерировать библиотеку привязки данных для создания необходимых классов, вернитесь в MainActivity и добавить две строки:

Если вы запустите приложение, вы увидите, что в TextView появится «Habrahabr Android Repository Article». Хорошая функция, да? 🙂

Но что произойдёт, если мы сделаем следующее:

Отобразится ли новый текст через 2 секунды? Нет, не отобразится. Вы должны заново установить значение repository. Что-то вроде этого будет работать:

Но это скучно, если нужно будет делать это каждый раз, когда мы меняем какое-то свойство. Существует лучшее решение, называемое Property Observer.
Давайте сначала опишем, что такое паттерн Observer, нам понадобится это в разделе rxJava:

Возможно, вы уже слышали об androidweekly.net. Это еженедельный информационный бюллетень об Android разработке. Если вы хотите его получить, вам необходимо подписаться на него, указав свой адрес электронной почты. Позже, если вы захотите, вы можете остановить отказаться от подписки на своем сайте.

Это один из примеров паттерна Observer / Observable. В данном случае, Android Weekly — наблюдаемый (Observable), он выпускает информационные бюллетени каждую неделю. Читатели — это наблюдатели (Observers), они подписываются на него, ждут новых выпусков, и, как только они получают её, они читают её, и если некоторые из них решат, что им это не нравится, он / она может прекратить следить.

Property Observer, в нашем случае, представляет собой XML-макет, который будет прослушивать изменения в экземпляре Repository. Таким образом, Repository является наблюдаемым. Например, как только свойство name класса Repository изменяется в экземпляре класса, xml должен обновится без вызова:

Как сделать это с помощью библиотеки привязки данных? Библиотека привязки данных предоставляет нам класс BaseObservable, который должен быть реализован в классе Repository:

BR — это класс, который автоматически генерируется один раз, когда используется аннотация Bindable. Как вы можете видеть, как только новое значение установлено, мы узнаём об этом. Теперь вы можете запустить приложение, и вы увидите, что имя репозитория будет изменено через 2 секунды без повторного вызова функции executePendingBindings ().

Для этой части это всё. В следующей части я напишу о паттерне MVVM, паттерне Repository и об Android Wrapper Managers. Вы можете найти весь код здесь. Эта статья охватывает код до этого коммита.

Источник