да, скозлил шпаргалку
- Установка KivyMD
- Установка поддержки синтаксиса kivy language в PyCharm
- Конфигурационные файлы
- Основные свойства
- Темы
- Макеты
- Кнопки
- Текстовые поля
- Label
- Менеджер экранов
- Список и прокрутка
- Контроль выбора SelectionControls
- Верхний бар приложения TopAppBar
- Нижний бар приложения BottomAppBar
- Сборка APK
- Установите последнюю версию KivyMD
py -m pip install https://github.com/kivymd/KivyMD/archive/master.zip
- Перейдите по ссылке https://github.com/noembryo/KV4Jetbrains/releases.
- Скачайте последнюю версию. Скачивать надо
.jarфайл. - Откройте любой проект в PyCharm
File->Manage IDE Settings->Import Settings. - Выберите скачанный файл
jarи нажмитеОK.
Если вы намерены использовать kivy language файл, то фаш проект будет иметь
минимум два файла:
ui.kv- файла kivy languagemain.py- исполняемый файл python
Рассмотрим пример проекта:
-
ui.kv
Интерфейс на языкеkivy languageпредставляет собой структуру вложенных друг в друга виджетов и их свойств. На нулевом уровне (относительно табуляции) у нас всегда может быть только один элемент, который является корневым.
Объявив необходимый нам элемент мы проваливаемся на уровень в него и по необходимости указываем его свойства, а только потом помещаем внутрь дочерние элементы.MDScreen: # Корневой элемент, единственный на 0 уровне md_bg_color: self.theme_cls.primaryColor # Свойство элемента MDScreen MDTopAppBar: # Элемент находящийся внутри MDScreen type:'small' # Свойство элемента MDTopAppBar pos_hint: {'top':1} # Свойство элемента MDTopAppBar MDTopAppBarTitle: # Элемент находящийся внутри MDTopAppBar id: appbar_title # Идентификатор элемента MDTopAppBarTitle text:'Не нажимай кнопку' # Свойство элемента MDTopAppBarTitle MDButton: # Элемент находящийся внутри MDScreen style: 'tonal' # Свойство элемента MDButton pos_hint: {'center_x': .5,'center_y':.5} # Свойство элемента MDButton on_press: app.red_button(self) # Событие элемента MDButton MDButtonText: id: btn1_text # Идентификатор элемента MDTopAppBarTitle text: 'Жми сюда!' # Свойство элемента MDButtonText
-
main.py
Исполняемый файл проекта. В нем создается класс приложения который мы в дальнейшем запустим. У наименования класса приложения есть одна особенность. Если вы не укажите у приложения свойствоtitle, то по умолчанию за название возьмется имя класса приложение, но если в имени в конце есть фрагментApp, то за название возьмется только правая часть названия до него.
Ещё стоит обратить внимание, что собранный интерфейс желательно сохранить в атрибут класса для него обычно для удобства берут названиеrootилиscreen. Данный атрибут нам поможет в дальнейшем с удобством обращаться к элементам интерфейса. В примере ниже видно как для поиска используется методаidsкоторый возвращает элемент с указаннымid.from kivymd.app import MDApp # Импортируем класс приложения KivyMD from kivy.lang import Builder # Импортируем конструктор интерфейса с kivy language class HelloApp(MDApp): screen = None def build(self): self.theme_cls.primary_palette = 'Coral' # Цветовая палитра приложения self.theme_cls.theme_style = 'Light' # Тема приложения Светлая/Темная self.title = 'KivyMD' # Название окна приложения self.screen = Builder.load_file('ui.kv') # Собираем интерфейс из нашего kv файла и сохраняем в атрибут screen return self.screen # Передаем собранный интерфейс в корень приложения def red_button(self, btn): # Создаем функцию, которую вызовем через кнопку self.screen.ids.btn1_text.text = 'Не жми сюда!' # Меняем текст кнопки через поиск по идентификатору кнопки self.screen.ids.appbar_title.text = 'А я говорил!' # Меняем текст верхней панели поиском по идентификатору btn.disabled = True # Отключаем нажатую кнопку HelloApp().run() # Запускаем приложение
-
main.pyfrom kivymd.app import MDApp from kivy.lang import Builderclass TestApp(MDApp): def build_config(self, config): config.setdefaults('DISPLAY',{ 'theme_style': 'Dark', 'primary_palette':'Blue' }) # Устанавливаем дефолтную структуру конфиг файла config.setdefaults('SESSION', { 'login':None, 'token': None }) # Устанавливаем дефолтную структуру конфиг файла
def build(self): self.root = Builder.load_file('ui.kv') self.theme_cls.theme_style = self.config.get('DISPLAY',"theme_style") # Считать значение в конфиге self.theme_cls.primary_palette = self.config.get('DISPLAY',"primary_palette") # Считать значение в конфиге self.config.set('SESSION','token','278392738yeudy2dyy281yd89su1298edu21') # Установить значение в конфиге self.config.write() # Записать конфиг в файл return self.rootTestApp().run()
-
Содержимое файла ini
[DISPLAY] theme_style = Dark primary_palette = Blue [SESSION] login = None token = 278392738yeudy2dyy281yd89su1298edu21
Важно знать что ось координат верстки интерфейса находиться в нижнем левом углу
-
pos- позиция элемента относительного его родительского элемента в пикселях, принимает два значения x, ykv.uiMDScreen: MDButton: style:'elevated' pos: [50,50] MDButtonText: text:'Тестовая кнопка'- Интерфейс
-
pos_hint- позиция виджета относительного его родительского элемента в процентном соотношенииПроцент задается в следующем формате:
1- 100%,0.5- 50%,0- 0% и т.д.x- расположение элемента (начало его координат) относительно оси xkv.uiMDScreen: MDButton: style:'elevated' pos_hint: {'x':.5} MDButtonText: text:'Тестовая кнопка'- Интерфейс
y- расположение элемента (начало его координат) относительно оси ykv.uiMDScreen: MDButton: style:'elevated' pos_hint: {'y':.5} MDButtonText: text:'Тестовая кнопка'- Интерфейс
right- расположение правой части элемента (при значении 1 ставит элемент в плотную справа)kv.uiMDScreen: MDButton: style:'elevated' pos_hint: {'right':.9} MDButtonText: text:'Тестовая кнопка'- Интерфейс
top- расположение верхней части элемента (при значении 1 ставит элемент в плотную сверху)kv.uiMDScreen: MDButton: style:'elevated' pos_hint: {'top':.9} MDButtonText: text:'Тестовая кнопка'- Интерфейс
center_x- расположение центра элемента относительно оси xkv.uiMDScreen: MDButton: style:'elevated' pos_hint: {'center_x':.5} MDButtonText: text:'Тестовая кнопка'- Интерфейс
center_y- расположение центра элемента относительно оси ykv.uiMDScreen: MDButton: style:'elevated' pos_hint: {'center_y':.5} MDButtonText: text:'Тестовая кнопка'- Интерфейс
-
size- размер элемента в пикселях (ширина/высота)kv.uiMDScreen: MDButton: style:'elevated' size:[500,500] MDButtonText: text:'Тестовая кнопка- Интерфейс
-
size_hint- размер элемента в процентах относительно родительского элемента (ширина/высота)
-
disabled- булево значение определяющее активен ли элемент (ширина/высота)kv.uiMDScreen: MDFloatLayout: MDButton: style:'elevated' pos_hint:{'center_x':.5,'center_y':.5} disabled: True MDButtonText: text:'Тестовая кнопка'- Интерфейс
-
opacity- свойство определяет непрозрачность виджета, принимая значение от 0 (полностью прозрачный) до 1 (полностью непрозрачный).kv.uiMDScreen: MDFloatLayout: MDButton: style:'elevated' pos_hint:{'center_x':.5,'center_y':.5} opacity: .5 MDButtonText: text:'Тестовая кнопка'- Интерфейс
Чтобы снять фиксированный размер элемента нужно указать один или несколько след. атрибутов:
theme_height: 'Custom'- открывает изменение высоту размера эл-таtheme_width: 'Custom'- открывает изменение высоту размера эл-та
adaptive_size : True- открывает изменение всего размера эл-таadaptice_width: True- открывает изменение высоту размера эл-таadaptive_height: True- открывает изменение высоту размера эл-та
Для изменения фона приложения в MDScreen указываем свойство md_bg_color со значением self.theme_cls.backgroundColor
kv.uiMDScreen: md_bg_color: app.theme_cls.backgroundColor MDButton: style:'outlined' pos_hint: {'center_x':.5,'center_y':.5} MDButtonText: text: 'Кнопка'- Интерфейс
main.pyfrom kivymd.app import MDApp from kivy.lang import Builder class TestApp(MDApp): def build(self): self.root = Builder.load_file('ui.kv') self.theme_cls.theme_style = 'Dark' # Выбор темы приложения self.theme_cls.primary_palette = 'Blue' # Выбор цветовой схемы return self.root TestApp().run()
- Интерфейс
Все иконки в kivymd используется со след. документации https://fonts.google.com/icons. Или скачать здесь из папки download.
-
horizontalkv.uiMDScreen: MDBoxLayout: orientation: 'horizontal' size_hint:[1,None] pos_hint:{'top':1} MDButton: style:'elevated' MDButtonText: text:'Кнопка 1' MDButton: style:'elevated' MDButtonText: text:'Кнопка 1' MDButton: style:'elevated' MDButtonText: text:'Кнопка 1'- Интерфейс
-
verticalkv.uiMDScreen: MDBoxLayout: orientation: 'vertical' size_hint:[1,None] pos_hint:{'top':1} MDButton: style:'elevated' MDButtonText: text:'Кнопка 1' MDButton: style:'elevated' MDButtonText: text:'Кнопка 1' MDButton: style:'elevated' MDButtonText: text:'Кнопка 1'- Интерфейс
-
Дополнительные свойства:
padding- внутренний отступ от границ макетаorientation- расположение элементов в макетеverticalhorizontal
spacing- отступы между элементами внутри макета
-
kv.uiMDScreen: MDGridLayout: size_hint:[1,1] cols:3 rows:3 spacing: 10 pos_hint:{'top':1} MDButton: style:'elevated' MDButtonText: text:'Кнопка 1' MDButton: style:'elevated' MDButtonText: text:'Кнопка 2' MDButton: style:'elevated' MDButtonText: text:'Кнопка 3' MDButton: style:'elevated' MDButtonText: text:'Кнопка 4' MDButton: style:'elevated' MDButtonText: text:'Кнопка 5' MDButton: style:'elevated' MDButtonText: text:'Кнопка 6' MDButton: style:'elevated' MDButtonText: text:'Кнопка 7' MDButton: style:'elevated' MDButtonText: text:'Кнопка 8' MDButton: style:'elevated' MDButtonText: text:'Кнопка 9' -
Интерфейс
-
Дополнительные свойства:
padding- внутренний отступ от границ макетаorientation- направление элементов в макетеlr-tbtb-lrrl-tbtb-rllr-btbt-lrrl-btbt-rl
spacing- отступы между элементами внутри макетаcols- кол-во колонокrows- кол-во строк
kv.uiMDScreen: MDButton: style: "elevated" pos_hint: {"center_x": .5, "center_y": .5} MDButtonIcon: icon: "plus" MDButtonText: text: "Elevated"- Интерфейс
kv.uiMDScreen: MDButton: style: "elevated" pos_hint: {"center_x": .5, "center_y": .5} MDButtonIcon: # Если не указывать не будет иконки icon: "plus" MDButtonText: text: "Elevated"- Интерфейс
kv.uiMDScreen: MDButton: style: "filled" pos_hint: {"center_x": .5, "center_y": .5} MDButtonText: text: "Filled"- Интерфейс
kv.uiMDScreen: MDButton: style: "tonal" pos_hint: {"center_x": .5, "center_y": .5} MDButtonText: text: "Tonal"- Интерфейс
kv.uiMDScreen: MDButton: style: "outlined" pos_hint: {"center_x": .5, "center_y": .5} MDButtonText: text: "Outlined"- Интерфейс
kv.uiMDScreen: MDButton: style: "text" pos_hint: {"center_x": .5, "center_y": .5} MDButtonText: text: "Text"- Интерфейс
kv.uiMDScreen: MDIconButton: style: "filled" icon: "heart-outline" pos_hint: {"center_x": .5, "center_y": .5}- Интерфейс
Icon Button поддерживает все те же стили, что и обычная кнопка
Segmented button
kv.uiMDScreen: MDFabButton: icon: "pencil-outline" style: "standard" pos_hint: {"center_x": .5, "center_y": .5}- Интерфейс
Fab Button имеете следующие стили
standard,smallиlarge
kv.uiMDScreen: md_bg_color: app.theme_cls.surfaceColor MDExtendedFabButton: id: btn pos_hint: {"center_x": .5, "center_y": .5} on_press: self.fab_state = "expand" \ if self.fab_state == "collapse" else "collapse" MDExtendedFabButtonIcon: icon: "pencil-outline" MDExtendedFabButtonText: text: "Compose"- Интерфейс
- Обычное состояние
- После нажатия
- Обычное состояние
У этой кнопки есть атрибут
fab_statec двумя возможными значениямиcollapse(свернуть) иexpand(развернуть)
kv.uiMDScreen: MDButton: style: "tonal" theme_width: "Custom" theme_height: "Custom" size_hint: [.5,.5] pos_hint: {'center_x':.5,'center_y':.5} MDButtonIcon: x: text.x - (self.width + dp(10)) icon: "plus" MDButtonText: id: text text: "Tonal" pos_hint: {"center_x": .5, "center_y": .5}- Интерфейс
Чтобы разрешить изменение у элемента свойства размера нужно выставить атрибут с приставкой
theme_в режимCustom
kv.uiMDScreen: md_bg_color: app.theme_cls.backgroundColor MDTextField: mode: "outlined" size_hint_x: None width: "240dp" pos_hint: {"center_x": .5, "center_y": .5} MDTextFieldLeadingIcon: icon: "account" MDTextFieldHintText: text: "Пиши здесь!" MDTextFieldHelperText: text: "Да здесь текст писать надо" mode: "persistent" MDTextFieldTrailingIcon: icon: "information" MDTextFieldMaxLengthText: max_text_length: 10- Интерфейс
-
mode: "filled"kv.uiMDScreen: md_bg_color: app.theme_cls.backgroundColor MDTextField: mode: "filled" size_hint_x: None width: "240dp" pos_hint: {"center_x": .5, "center_y": .5} MDTextFieldLeadingIcon: icon: "account" MDTextFieldHintText: text: "Пиши здесь!" MDTextFieldHelperText: text: "Да здесь текст писать надо" mode: "persistent" MDTextFieldTrailingIcon: icon: "information" MDTextFieldMaxLengthText: max_text_length: 10- Интерфейс
-
mode: "outlined"kv.uiMDScreen: md_bg_color: app.theme_cls.backgroundColor MDTextField: mode: "outlined" size_hint_x: None width: "240dp" pos_hint: {"center_x": .5, "center_y": .5} MDTextFieldLeadingIcon: icon: "account" MDTextFieldHintText: text: "Пиши здесь!" MDTextFieldHelperText: text: "Да здесь текст писать надо" mode: "persistent" MDTextFieldTrailingIcon: icon: "information" MDTextFieldMaxLengthText: max_text_length: 10- Интерфейс
ui.kvMDSlider: step: 1 # Шаг value: 50 # Текущее значение min:0 # Минимальное значение max:100 # Максимальное значение orientation:'horizontal' # Ориентация слайдера MDSliderHandle: # Отображение точки MDSliderValueLabel: # Отображение значения- Экран
Полезные атрибуты и события:
track_active_color- цвет активного слайдераtrack_active_step_point_color- цвет точек активной части слайдераtrack_inactive_step_point_color- цвет точек неактивной части слайдераtrack_inactive_color- цвет неактивного слайдера
kv.uiMDScreen: md_bg_color: app.theme_cls.backgroundColor MDLabel: text: "MDLabel" halign: "center" theme_text_color: "Custom" # Если необходимо включаем возможность использование собтвенного цвета для текста text_color: "red" # Указываем свой цвет шрифта font_style: "Display" # Указываем стиль role: "small" # Указываем роль- Интерфейс
Размеры label в основном зависят от стиля и роли
-
main.pyfrom kivymd.app import MDApp from kivy.lang import Builder from kivymd.uix.transition.transition import MDSwapTransition class TestApp(MDApp): def build(self): self.root = Builder.load_file('ui.kv') self.theme_cls.theme_style = 'Dark' self.theme_cls.primary_palette = 'Blue' self.root.ids.sm.transition = MDSwapTransition() # Текущая анимация переключения экранов return self.root TestApp().run()
-
kv.uiMDScreen: md_bg_color: app.theme_cls.backgroundColor MDScreenManager: id:sm MDScreen: name:'scr1' MDButton: theme_width:'Custom' theme_height:'Custom' size_hint:[.5, .5] pos_hint: {"center_x": .5, "center_y": .5} on_press: app.root.ids.sm.current = 'scr2' MDButtonText: pos_hint: {"center_x": .5, "center_y": .5} text: "Screen 1" MDScreen: name:'scr2' MDButton: theme_width:'Custom' theme_height:'Custom' size_hint:[.5, .5] pos_hint: {"center_x": .5, "center_y": .5} on_press: app.root.ids.sm.current = 'scr3' MDButtonText: pos_hint: {"center_x": .5, "center_y": .5} text: "Screen 2" MDScreen: name:'scr3' MDButton: theme_width:'Custom' theme_height:'Custom' size_hint:[.5, .5] pos_hint: {"center_x": .5, "center_y": .5} on_press: app.root.ids.sm.current = 'scr4' MDButtonText: pos_hint: {"center_x": .5, "center_y": .5} text: "Screen 3" MDScreen: name:'scr4' MDButton: theme_width:'Custom' theme_height:'Custom' size_hint:[.5, .5] pos_hint: {"center_x": .5, "center_y": .5} on_press: app.root.ids.sm.current = 'scr1' MDButtonText: pos_hint: {"center_x": .5, "center_y": .5} text: "Screen 4"
У Screen manager есть два основных свойства:
current- текущий экранtransition- вид анимации
У самого же экрана есть атрибут
name- название экрана
- MDSwapTransition - переход по замене, который выглядит как переход iOS при появлении нового окна на экране
duration- указываем время проигрывания анимации
- MDSlideTransition - переход слайдов сдвигом можно использовать для показа нового экрана с любого направления: слева, справа, сверху или снизу
direction- указывает направление сдвигаleftrightupdown
duration- указываем время проигрывания анимации
- MDFadeSlideTransition - переход слайдов подтасовкой можно использовать для показа нового экрана с любого направления: слева, справа, сверху или снизу.
direction- указывает направление сдвигаleftrightupdown
duration- указываем время проигрывания анимации
- MDSharedAxisTransition - переход экрана по умолчанию в android.
transition_axis- указывает по какой оси будет происходить сдвиг с исчезновениемxyz
duration- указываем время проигрывания анимации
ui.kvMDScreen: md_bg_color: app.theme_cls.backgroundColor MDScrollView: MDBoxLayout: orientation:'vertical' adaptive_height:True MDListItem: MDListItemLeadingIcon: icon: 'plus' MDListItemHeadlineText: text: 'Тест заголовок' MDListItemSupportingText: text:'Текст подсказка' MDListItemTertiaryText: text:'Текст уточнение' MDListItemTrailingCheckbox: MDListItem: MDListItemLeadingIcon: icon: 'plus' MDListItemHeadlineText: text: 'Тест заголовок' MDListItemSupportingText: text:'Текст подсказка' MDListItemTertiaryText: text:'Текст уточнение' MDListItemTrailingCheckbox: MDListItem: MDListItemLeadingIcon: icon: 'plus' MDListItemHeadlineText: text: 'Тест заголовок' MDListItemSupportingText: text:'Текст подсказка' MDListItemTertiaryText: text:'Текст уточнение' MDListItemTrailingCheckbox: MDListItem: MDListItemLeadingIcon: icon: 'plus' MDListItemHeadlineText: text: 'Тест заголовок' MDListItemSupportingText: text:'Текст подсказка' MDListItemTertiaryText: text:'Текст уточнение' MDListItemTrailingCheckbox:
MDScrollViewявляется контейнером который может скролить свое содержимое
on_scroll_start- событие срабатываемся при начале прокруткиon_scroll_move- событие срабатываемся во время прокруткиon_scroll_stop- событие срабатываемся при прекращении прокруткиdo_scroll_x- принимает булево значение, включение прокрутки по оси xdo_scroll_y- принимает булево значение, включение прокрутки по оси ybar_pos_x- с какой стороны разместить полосу прокрутки оси xbar_pos_y- с какой стороны разместить полосу прокрутки оси ybar_width- ширина полосы прокруткиhbar- возвращает положение и размер горизонтальной полосы прокруткиvbar- возвращает положение и размер горизонтальной полосы прокруткиscroll_x- текущее значение прокрутки оси x (0 - слева, 1 - справа)scroll_y- текущее значение прокрутки оси y (0 - снизу, 1 - сверху)
-
main.pyfrom kivymd.app import MDApp from kivy.lang import Builder class TestApp(MDApp): def build(self): self.root = Builder.load_file('ui.kv') self.theme_cls.theme_style = 'Dark' self.theme_cls.primary_palette = 'Blue' return self.root def on_check_box(self,checkbox, active): if active: print(checkbox.value) print(checkbox.group) TestApp().run()
-
ui.kvMDScreen: md_bg_color: app.theme_cls.backgroundColor MDBoxLayout: orientation:'vertical' adaptive_size: True spacing: 10 pos_hint: {'center_y':.5, 'center_x':.5} MDBoxLayout: orientation:'horizontal' adaptive_size:True MDCheckbox: value: '1' padding: [0,0,0,0] on_active: app.on_check_box(*args) MDLabel: text:'Тест 1' adaptive_width: True MDBoxLayout: orientation:'horizontal' adaptive_size:True MDCheckbox: value: '2' padding: [0,0,0,0] on_active: app.on_check_box(*args) MDLabel: text:'Тест 2' adaptive_width: True MDBoxLayout: orientation:'horizontal' adaptive_size:True MDCheckbox: value: '3' padding: [0,0,0,0] on_active: app.on_check_box(*args) MDLabel: text:'Тест 3' adaptive_width: True
У
MDCheckBoxесть свойствоactiveкоторое хранить булево значения текущего состояния эл-та (выбран/не выбран)
-
main.pyfrom kivymd.app import MDApp from kivy.lang import Builder class TestApp(MDApp): def build(self): self.root = Builder.load_file('ui.kv') self.theme_cls.theme_style = 'Dark' self.theme_cls.primary_palette = 'Blue' return self.root def on_check_box(self,checkbox, active): if active: print(checkbox.value) print(checkbox.group) TestApp().run()
-
ui.kvMDScreen: md_bg_color: app.theme_cls.backgroundColor MDBoxLayout: orientation:'vertical' adaptive_size: True spacing: 10 pos_hint: {'center_y':.5, 'center_x':.5} MDBoxLayout: orientation:'horizontal' adaptive_size:True MDCheckbox: group: 'test' value: '1' padding: [0,0,0,0] on_active: app.on_check_box(*args) MDLabel: text:'Тест 1' adaptive_width: True MDBoxLayout: orientation:'horizontal' adaptive_size:True MDCheckbox: group: 'test' value: '2' padding: [0,0,0,0] on_active: app.on_check_box(*args) MDLabel: text:'Тест 2' adaptive_width: True MDBoxLayout: orientation:'horizontal' adaptive_size:True MDCheckbox: group: 'test' value: '3' padding: [0,0,0,0] on_active: app.on_check_box(*args) MDLabel: text:'Тест 3' adaptive_width: True
Если мы хотим использовать выбор одного из нескольких, то обязаны задать одинаковое имя группы для всех элементов перечисления
-
main.pyfrom kivymd.app import MDApp from kivy.lang import Builder class TestApp(MDApp): def build(self): self.root = Builder.load_file('ui.kv') self.theme_cls.theme_style = 'Dark' self.theme_cls.primary_palette = 'Blue' return self.root def on_check_box(self,checkbox, active): if active: print(checkbox.value) print(checkbox.group) TestApp().run()
-
ui.kvMDScreen: md_bg_color: app.theme_cls.backgroundColor MDBoxLayout: orientation:'vertical' adaptive_size: True spacing: 10 pos_hint: {'center_y':.5, 'center_x':.5} MDBoxLayout: orientation:'horizontal' adaptive_size:True MDCheckbox: group: 'root' value: '0' padding: [0,0,0,0] on_active: app.on_check_box(*args) MDLabel: text:'Тесты' adaptive_width: True MDBoxLayout: orientation:'horizontal' adaptive_size:True MDCheckbox: group: 'child' value: '1' padding: [20,0,0,0] on_active: app.on_check_box(*args) MDLabel: text:'Тест 1' adaptive_width: True MDBoxLayout: orientation:'horizontal' adaptive_size:True MDCheckbox: group: 'child' value: '2' padding: [20,0,0,0] on_active: app.on_check_box(*args) MDLabel: text:'Тест 2' adaptive_width: True
checkbox_icon_normal- иконка отображаемая во включенном состоянии (только для мн. выбора)checkbox_icon_down- иконка отображаемая в отключенном состоянии (только для мн. выбора)radio_icon_normal- иконка отображаемая во включенном состоянии (только для выбора одного из нескольких)radio_icon_down- иконка отображаемая в отключенном состоянии (только для выбора одного из нескольких)color_active- цвет иконки во включенном состоянииcolor_inactive- цвет иконки в отключенном состоянии
Чтобы создать иерархию нужно задать родительскому эл-ту группу
root, а дочернимchild
ui.kvMDScreen: md_bg_color: app.theme_cls.backgroundColor MDSwitch: pos_hint: {'center_y':.5, 'center_x':.5} on_active: print(1)
icon_active- иконка отображаемая во включенном состоянииicon_inactive- иконка отображаемая в отключенном состоянииicon_active_color- цвет значка во включенном состоянииicon_inactive_color- цвет значка в отключенном состоянииthumb_color_active- цвет фона бегунка во включенном состоянииthumb_color_inactive- цвет фона бегунка в отключенном состоянииtrack_color_active- цвет фона переключателя во включенном состоянииtrack_color_inactive- цвет фона переключателя в отключенном состоянии
Переключатель содержит те же события и свойства, что и эл-нт выбора
-
main.pyfrom kivymd.app import MDApp from kivy.lang import Builder from kivy.graphics import Color, Ellipse, Line size_line=16 type_edit="ellipse" # ellipse, line color=[0,1,0,1] class TestApp(MDApp): def build(self): self.root = Builder.load_file('ui.kv') self.config.write() # Записать конфиг в файл return self.root def touch_down(self, element, touch): holst = self.root.ids.holst with holst.canvas: Color(color[0], color[1], color[2], color[3]) # Цвет создаваемого элемента if type_edit == "line" and holst.collide_point(touch.x + size_line / 2, touch.y + size_line / 2): # Выбранный способ рисования не выходит за границы Ellipse( pos=[touch.x - size_line / 2, touch.y - size_line / 2], size=[size_line, size_line] ) touch.ud["line"] = Line( points=[touch.x - size_line / 4, touch.y - size_line / 4], width=size_line / 2 ) if type_edit == "ellipse" and holst.collide_point(touch.x, touch.y): # Выбранный способ рисования не выходит за границы touch.ud["ellipse"] = Ellipse( pos=[touch.x, touch.y], size=[0, 0] ) def touch_up(self, element, touch): holst = self.root.ids.holst with holst.canvas: Color(color[0], color[1], color[2], color[3]) if type_edit == "line" and holst.collide_point(touch.x + size_line / 2, touch.y + size_line / 2): touch.ud["line"].points += [touch.x - size_line / 4, touch.y - size_line / 4] if type_edit == "ellipse" and holst.collide_point(touch.x, touch.y): print("yes") touch.ud["ellipse"].size = [touch.x - touch.ud["ellipse"].pos[0], touch.y - touch.ud["ellipse"].pos[1]] TestApp().run()
Функция
collide_pointпроверяет входит ли указанные координаты в элемент -
ui.kvMDScreen: md_bg_color: app.theme_cls.backgroundColor MDWidget: id:holst pos_hint: {'center_x':.5,'center_y':.5} theme_bg_color:'Custom' md_bg_color:[1,0,0] size_hint_x:None size_hint_y:None theme_width: 'Custom' theme_height: 'Custom' size:[300,300] on_touch_down: app.touch_down(*args) on_touch_up: app.touch_up(*args)
ui.kvMDScreen: md_bg_color: self.theme_cls.backgroundColor MDTopAppBar: # Создание бара type: "small" # Тип бпрп pos_hint: {"top": 1} MDTopAppBarLeadingButtonContainer: # Левый контейнер с кнопками MDActionTopAppBarButton: # Кнопка для бара icon: "menu" MDTopAppBarTitle: # Заголовок бара text: "AppBar small" # Текст загловка pos_hint: {"center_x": .5} # Центруем текст заголовка MDTopAppBarTrailingButtonContainer: # Правый контейнер с кнопками MDActionTopAppBarButton: # Кнопка для бара icon: "account-circle-outline"
Типы TopAppBar (атрибут type):
small
medium
large
-
main.pyfrom kivymd.app import MDApp from kivy.lang import Builder from kivymd.uix.appbar import MDActionBottomAppBarButton from kivymd.uix.list import * from faker import Faker fake = Faker('ru-RU') class TestApp(MDApp): def build(self): self.root = Builder.load_file('ui.kv') self.root.ids.bottom_appbar.action_items = [ # создаем кнопки управления MDActionBottomAppBarButton(icon='gmail') # Добавляем кнопку управления ] for i in range(50): self.root.ids.cont_list.add_widget( MDListItem( MDListItemLeadingIcon( icon='account', ), MDListItemHeadlineText( text=fake.name(), ), MDListItemSupportingText( text=fake.phone_number() ) ) ) return self.root TestApp().run()
-
ui.kvMDScreen: md_bg_color: app.theme_cls.backgroundColor ScrollView: # Прокрутка id:card_list MDBoxLayout: # Контейнер который прокучиваем id: cont_list orientation:'vertical' adaptive_height: True MDBottomAppBar: # Нижний бар id: bottom_appbar scroll_cls: card_list # Указываем эл-нт прокрутки для автоскрытия бара allow_hidden: True # Включение автоскрытия бара MDFabBottomAppBarButton: # Функциональная кнопка управления icon: "plus" theme_bg_color: "Custom" md_bg_color: app.theme_cls.primaryColor theme_icon_color: 'Custom' icon_color: 'white' -
Экран:
Все кнопки управления хранятся в атрибуте action_items у BottomAppBar в виде списка кнопок MDActionBottomAppBarButton
Обратите внимание что при скрытии BottomAppBar функциональная кнопка остается на месте. Стоит отметить что функционал автоскрытия не обязателен и вы можете его не использовать.
Вы можете вручную скрыть/отобразить BottomAppBar используя методы hide_bar()/show_bar().
-
Проверяете наличие поддержки вашим процессором виртуализации. Включаете виртуализацию в
BIOS. -
Скачиваете
Ubuntu Desktopс оф. сайта. -
Включаете компонент
Hyper-V:- открываете поиск в меню
ПУСК; - ищите
Включение и отключение компонентов Windowsи открываете; - находите в списке
Hyper-Vи ставите ему галочку; - нажимаете
ОКи ждёте окончания установки; - перезагружаете компьютер.
- открываете поиск в меню
-
Открываете
Диспетчер Hyper-V -
Создаете виртуальную машину и устанавливаете на нее
Ubuntuкоторый скачали ранее. (Как?) -
Открываете
Ubuntu. -
Заходите в терминал и выполняете след. команду
sudo apt update sudo apt install python3-pip sudo apt install -y git zip unzip openjdk-17-jdk python3-pip autoconf libtool pkg-config zlib1g-dev cmake libffi-dev libssl-dev -
Скачиваете
PyCharm Communityв Магазине приложений наUbuntu -
Создаете проект с виртуализацией под названием
Buildozer -
Открываем терминал в PyCharm и выполняете след. команды
pip3 install buildozer pip3 install Cython==0.29.33 pip3 install setuptools pip3 install https://github.com/kivymd/KivyMD/archive/master.zip -
Теперь у нас есть настроенный сборщик наших проектов.
-
Добавляем файлы своего проекта
-
Создаем
specфайл командойbuildozer init -
В
specфайле обязательно исправляем след. параметры- requirements - библиотеки используемые в вашем проекте
requirements = python3, kivy, https://github.com/kivymd/KivyMD/archive/master.zip, materialyoucolor, exceptiongroup, asyncgui, asynckivy, И аналогично остальные ваши библиотеки проекта - osx.kivy_version - ваша версия kivy в проекте
osx.kivy_version = 2.3.1 # Указываете свою версию
- requirements - библиотеки используемые в вашем проекте
-
Запускаете сборку проекта командой:
buildozer android debugЕсли у вас в проекте измениться состав библиотек желательно делать очистку сборщика командой:
buildozer android clean