mirror of
https://github.com/markqvist/Sideband.git
synced 2025-08-08 06:22:15 -04:00
Restructured repository
This commit is contained in:
Mark Qvist
parent
46269dd82b
commit
0de4c12c17
274 changed files with 51617 additions and 45 deletions
644
sbapp/kivymd/uix/chip/chip.py
Executable file
644
sbapp/kivymd/uix/chip/chip.py
Executable file
|
|
@ -0,0 +1,644 @@
|
|||
"""
|
||||
Components/Chip
|
||||
===============
|
||||
|
||||
.. seealso::
|
||||
|
||||
`Material Design spec, Chips <https://material.io/components/chips>`_
|
||||
|
||||
.. rubric:: Chips are compact elements that represent an input, attribute, or action.
|
||||
|
||||
.. image:: https://github.com/HeaTTheatR/KivyMD-data/raw/master/gallery/kivymddoc/chips.png
|
||||
:align: center
|
||||
|
||||
Usage
|
||||
-----
|
||||
|
||||
.. code-block:: python
|
||||
|
||||
from kivy.lang import Builder
|
||||
|
||||
from kivymd.app import MDApp
|
||||
|
||||
KV = '''
|
||||
MDScreen:
|
||||
|
||||
MDChip:
|
||||
text: "Portland"
|
||||
pos_hint: {"center_x": .5, "center_y": .5}
|
||||
on_release: app.on_release_chip(self)
|
||||
'''
|
||||
|
||||
|
||||
class Test(MDApp):
|
||||
def build(self):
|
||||
return Builder.load_string(KV)
|
||||
|
||||
def on_release_chip(self, instance_check):
|
||||
print(instance_check)
|
||||
|
||||
|
||||
Test().run()
|
||||
|
||||
.. image:: https://github.com/HeaTTheatR/KivyMD-data/raw/master/gallery/kivymddoc/ordinary-chip.png
|
||||
:align: center
|
||||
|
||||
Use with right icon
|
||||
-------------------
|
||||
|
||||
.. code-block:: kv
|
||||
|
||||
MDChip:
|
||||
text: "Portland"
|
||||
icon_right: "close-circle-outline"
|
||||
|
||||
.. image:: https://github.com/HeaTTheatR/KivyMD-data/raw/master/gallery/kivymddoc/chip-with-right-icon.png
|
||||
:align: center
|
||||
|
||||
Use with left icon
|
||||
------------------
|
||||
|
||||
.. code-block:: kv
|
||||
|
||||
MDChip:
|
||||
text: "Portland"
|
||||
icon_left: "map-marker"
|
||||
|
||||
.. image:: https://github.com/HeaTTheatR/KivyMD-data/raw/master/gallery/kivymddoc/chip-with-left-icon.png
|
||||
:align: center
|
||||
|
||||
Use with custom left icon
|
||||
-------------------------
|
||||
|
||||
.. code-block:: kv
|
||||
|
||||
MDChip:
|
||||
text: "Portland"
|
||||
icon_left: "avatar.png"
|
||||
|
||||
.. image:: https://github.com/HeaTTheatR/KivyMD-data/raw/master/gallery/kivymddoc/chip-with-custom-left-icon.png
|
||||
:align: center
|
||||
|
||||
Use with left and right icon
|
||||
----------------------------
|
||||
|
||||
.. code-block:: kv
|
||||
|
||||
MDChip:
|
||||
text: "Portland"
|
||||
icon_left: "avatar.png"
|
||||
icon_right: "close-circle-outline"
|
||||
|
||||
.. image:: https://github.com/HeaTTheatR/KivyMD-data/raw/master/gallery/kivymddoc/chip-with-left-right-icon.png
|
||||
:align: center
|
||||
|
||||
Use with outline
|
||||
----------------
|
||||
|
||||
.. code-block:: kv
|
||||
|
||||
MDChip:
|
||||
text: "Portland"
|
||||
icon_left: "avatar.png"
|
||||
icon_right: "close-circle-outline"
|
||||
line_color: app.theme_cls.disabled_hint_text_color
|
||||
|
||||
.. image:: https://github.com/HeaTTheatR/KivyMD-data/raw/master/gallery/kivymddoc/chip-with-outline.png
|
||||
:align: center
|
||||
|
||||
Use with custom color
|
||||
---------------------
|
||||
|
||||
.. code-block:: kv
|
||||
|
||||
MDChip:
|
||||
text: "Portland"
|
||||
icon_left: "avatar.png"
|
||||
icon_right: "close-circle-outline"
|
||||
line_color: app.theme_cls.disabled_hint_text_color
|
||||
md_bg_color: 1, 0, 0, .5
|
||||
|
||||
.. image:: https://github.com/HeaTTheatR/KivyMD-data/raw/master/gallery/kivymddoc/chip-with-custom-color.png
|
||||
:align: center
|
||||
|
||||
Use with elevation
|
||||
------------------
|
||||
|
||||
.. code-block:: kv
|
||||
|
||||
MDChip:
|
||||
text: "Portland"
|
||||
icon_left: "avatar.png"
|
||||
icon_right: "close-circle-outline"
|
||||
line_color: app.theme_cls.disabled_hint_text_color
|
||||
md_bg_color: 1, 0, 0, .5
|
||||
elevation: 12
|
||||
|
||||
.. image:: https://github.com/HeaTTheatR/KivyMD-data/raw/master/gallery/kivymddoc/chip-with-elevation.png
|
||||
:align: center
|
||||
|
||||
Behavior
|
||||
========
|
||||
|
||||
Long press on the chip, it will be marked.
|
||||
When you click on the marked chip, the mark will be removed:
|
||||
|
||||
.. image:: https://github.com/HeaTTheatR/KivyMD-data/raw/master/gallery/kivymddoc/chip-activate.gif
|
||||
:align: center
|
||||
|
||||
Examples
|
||||
========
|
||||
|
||||
Multiple choose
|
||||
---------------
|
||||
|
||||
Selecting a single choice chip automatically deselects all other chips in the set.
|
||||
|
||||
.. code-block:: python
|
||||
|
||||
from kivy.animation import Animation
|
||||
from kivy.lang import Builder
|
||||
|
||||
from kivymd.uix.screen import MDScreen
|
||||
from kivymd.uix.chip import MDChip
|
||||
from kivymd.app import MDApp
|
||||
|
||||
KV = '''
|
||||
<MyScreen>
|
||||
|
||||
MDBoxLayout:
|
||||
orientation: "vertical"
|
||||
adaptive_size: True
|
||||
spacing: "12dp"
|
||||
padding: "56dp"
|
||||
pos_hint: {"center_x": .5, "center_y": .5}
|
||||
|
||||
MDLabel:
|
||||
text: "Multiple choice"
|
||||
bold: True
|
||||
font_style: "H5"
|
||||
adaptive_size: True
|
||||
|
||||
MDBoxLayout:
|
||||
id: chip_box
|
||||
adaptive_size: True
|
||||
spacing: "8dp"
|
||||
|
||||
MyChip:
|
||||
text: "Elevator"
|
||||
on_press: if self.active: root.removes_marks_all_chips()
|
||||
|
||||
MyChip:
|
||||
text: "Washer / Dryer"
|
||||
on_press: if self.active: root.removes_marks_all_chips()
|
||||
|
||||
MyChip:
|
||||
text: "Fireplace"
|
||||
on_press: if self.active: root.removes_marks_all_chips()
|
||||
|
||||
|
||||
ScreenManager:
|
||||
|
||||
MyScreen:
|
||||
'''
|
||||
|
||||
|
||||
class MyChip(MDChip):
|
||||
icon_check_color = (0, 0, 0, 1)
|
||||
text_color = (0, 0, 0, 0.5)
|
||||
_no_ripple_effect = True
|
||||
|
||||
def __init__(self, **kwargs):
|
||||
super().__init__(**kwargs)
|
||||
self.bind(active=self.set_chip_bg_color)
|
||||
self.bind(active=self.set_chip_text_color)
|
||||
|
||||
def set_chip_bg_color(self, instance_chip, active_value: int):
|
||||
'''
|
||||
Will be called every time the chip is activated/deactivated.
|
||||
Sets the background color of the chip.
|
||||
'''
|
||||
|
||||
self.md_bg_color = (
|
||||
(0, 0, 0, 0.4)
|
||||
if active_value
|
||||
else (
|
||||
self.theme_cls.bg_darkest
|
||||
if self.theme_cls.theme_style == "Light"
|
||||
else (
|
||||
self.theme_cls.bg_light
|
||||
if not self.disabled
|
||||
else self.theme_cls.disabled_hint_text_color
|
||||
)
|
||||
)
|
||||
)
|
||||
|
||||
def set_chip_text_color(self, instance_chip, active_value: int):
|
||||
Animation(
|
||||
color=(0, 0, 0, 1) if active_value else (0, 0, 0, 0.5), d=0.2
|
||||
).start(self.ids.label)
|
||||
|
||||
|
||||
class MyScreen(MDScreen):
|
||||
def removes_marks_all_chips(self):
|
||||
for instance_chip in self.ids.chip_box.children:
|
||||
if instance_chip.active:
|
||||
instance_chip.active = False
|
||||
|
||||
|
||||
class Test(MDApp):
|
||||
def build(self):
|
||||
return Builder.load_string(KV)
|
||||
|
||||
|
||||
Test().run()
|
||||
|
||||
.. image:: https://github.com/HeaTTheatR/KivyMD-data/raw/master/gallery/kivymddoc/chip-multiple-choose.gif
|
||||
:align: center
|
||||
|
||||
Only choose
|
||||
-----------
|
||||
|
||||
Only one chip will be selected.
|
||||
|
||||
.. code-block:: python
|
||||
|
||||
KV = '''
|
||||
<MyScreen>
|
||||
|
||||
[...]
|
||||
|
||||
MDBoxLayout:
|
||||
id: chip_box
|
||||
adaptive_size: True
|
||||
spacing: "8dp"
|
||||
|
||||
MyChip:
|
||||
text: "Elevator"
|
||||
on_active: if self.active: root.removes_marks_all_chips(self)
|
||||
|
||||
MyChip:
|
||||
text: "Washer / Dryer"
|
||||
on_active: if self.active: root.removes_marks_all_chips(self)
|
||||
|
||||
MyChip:
|
||||
text: "Fireplace"
|
||||
on_active: if self.active: root.removes_marks_all_chips(self)
|
||||
|
||||
|
||||
[...]
|
||||
'''
|
||||
|
||||
|
||||
class MyScreen(MDScreen):
|
||||
def removes_marks_all_chips(self, selected_instance_chip):
|
||||
for instance_chip in self.ids.chip_box.children:
|
||||
if instance_chip != selected_instance_chip:
|
||||
instance_chip.active = False
|
||||
|
||||
.. image:: https://github.com/HeaTTheatR/KivyMD-data/raw/master/gallery/kivymddoc/chip-only-choose.gif
|
||||
:align: center
|
||||
"""
|
||||
|
||||
__all__ = ("MDChip",)
|
||||
|
||||
import os
|
||||
|
||||
from kivy import Logger
|
||||
from kivy.animation import Animation
|
||||
from kivy.lang import Builder
|
||||
from kivy.metrics import dp
|
||||
from kivy.properties import BooleanProperty, ColorProperty, StringProperty
|
||||
from kivy.uix.behaviors import ButtonBehavior
|
||||
|
||||
from kivymd import uix_path
|
||||
from kivymd.theming import ThemableBehavior
|
||||
from kivymd.uix.behaviors import (
|
||||
FakeRectangularElevationBehavior,
|
||||
RectangularRippleBehavior,
|
||||
TouchBehavior,
|
||||
)
|
||||
from kivymd.uix.boxlayout import MDBoxLayout
|
||||
from kivymd.uix.label import MDIcon
|
||||
from kivymd.uix.stacklayout import MDStackLayout
|
||||
from kivymd.uix.templates import ScaleWidget
|
||||
|
||||
with open(
|
||||
os.path.join(uix_path, "chip", "chip.kv"), encoding="utf-8"
|
||||
) as kv_file:
|
||||
Builder.load_string(kv_file.read())
|
||||
|
||||
|
||||
class MDChip(
|
||||
ThemableBehavior,
|
||||
RectangularRippleBehavior,
|
||||
FakeRectangularElevationBehavior,
|
||||
TouchBehavior,
|
||||
ButtonBehavior,
|
||||
MDBoxLayout,
|
||||
):
|
||||
text = StringProperty()
|
||||
"""
|
||||
Chip text.
|
||||
|
||||
:attr:`text` is an :class:`~kivy.properties.StringProperty`
|
||||
and defaults to `''`.
|
||||
"""
|
||||
|
||||
icon = StringProperty("checkbox-blank-circle", deprecated=True)
|
||||
"""
|
||||
Chip icon.
|
||||
|
||||
.. deprecated:: 1.0.0
|
||||
Use :attr:`icon_right` and :attr:`icon_left` instead.
|
||||
|
||||
:attr:`icon` is an :class:`~kivy.properties.StringProperty`
|
||||
and defaults to `'checkbox-blank-circle'`.
|
||||
"""
|
||||
|
||||
icon_left = StringProperty()
|
||||
"""
|
||||
Chip left icon.
|
||||
|
||||
.. versionadded:: 1.0.0
|
||||
|
||||
:attr:`icon_left` is an :class:`~kivy.properties.StringProperty`
|
||||
and defaults to `''`.
|
||||
"""
|
||||
|
||||
icon_right = StringProperty()
|
||||
"""
|
||||
Chip right icon.
|
||||
|
||||
.. versionadded:: 1.0.0
|
||||
|
||||
:attr:`icon_right` is an :class:`~kivy.properties.StringProperty`
|
||||
and defaults to `''`.
|
||||
"""
|
||||
|
||||
color = ColorProperty(None, deprecated=True)
|
||||
"""
|
||||
Chip color in ``rgba`` format.
|
||||
|
||||
.. deprecated:: 1.0.0
|
||||
|
||||
:attr:`color` is an :class:`~kivy.properties.ColorProperty`
|
||||
and defaults to `None`.
|
||||
"""
|
||||
|
||||
text_color = ColorProperty(None)
|
||||
"""
|
||||
Chip's text color in ``rgba`` format.
|
||||
|
||||
:attr:`text_color` is an :class:`~kivy.properties.ColorProperty`
|
||||
and defaults to `None`.
|
||||
"""
|
||||
|
||||
icon_color = ColorProperty(None, deprecated=True)
|
||||
"""
|
||||
Chip's icon color in ``rgba`` format.
|
||||
|
||||
.. deprecated:: 1.0.0
|
||||
Use :attr:`icon_right_color` and :attr:`icon_left_color` instead.
|
||||
|
||||
:attr:`icon_color` is an :class:`~kivy.properties.ColorProperty`
|
||||
and defaults to `None`.
|
||||
"""
|
||||
|
||||
icon_right_color = ColorProperty(None)
|
||||
"""
|
||||
Chip's right icon color in ``rgba`` format.
|
||||
|
||||
.. versionadded:: 1.0.0
|
||||
|
||||
:attr:`icon_right_color` is an :class:`~kivy.properties.ColorProperty`
|
||||
and defaults to `None`.
|
||||
"""
|
||||
|
||||
icon_left_color = ColorProperty(None)
|
||||
"""
|
||||
Chip's left icon color in ``rgba`` format.
|
||||
|
||||
.. versionadded:: 1.0.0
|
||||
|
||||
:attr:`icon_left_color` is an :class:`~kivy.properties.ColorProperty`
|
||||
and defaults to `None`.
|
||||
"""
|
||||
|
||||
icon_check_color = ColorProperty(None)
|
||||
"""
|
||||
Chip's check icon color in ``rgba`` format.
|
||||
|
||||
.. versionadded:: 1.0.0
|
||||
|
||||
:attr:`icon_check_color` is an :class:`~kivy.properties.ColorProperty`
|
||||
and defaults to `None`.
|
||||
"""
|
||||
|
||||
check = BooleanProperty(False, deprecated=True)
|
||||
"""
|
||||
If `True`, a checkmark is added to the left when touch to the chip.
|
||||
|
||||
.. deprecated:: 1.0.0
|
||||
|
||||
:attr:`check` is an :class:`~kivy.properties.BooleanProperty`
|
||||
and defaults to `False`.
|
||||
"""
|
||||
|
||||
selected_chip_color = ColorProperty(None, deprecated=True)
|
||||
"""
|
||||
The color of the chip that is currently selected in ``rgba`` format.
|
||||
|
||||
.. deprecated:: 1.0.0
|
||||
|
||||
:attr:`selected_chip_color` is an :class:`~kivy.properties.ColorProperty`
|
||||
and defaults to `None`.
|
||||
"""
|
||||
|
||||
active = BooleanProperty(False)
|
||||
"""
|
||||
Whether the check is marked or not.
|
||||
|
||||
.. versionadded:: 1.0.0
|
||||
|
||||
:attr:`active` is an :class:`~kivy.properties.BooleanProperty`
|
||||
and defaults to `False`.
|
||||
"""
|
||||
|
||||
def __init__(self, **kwargs):
|
||||
super().__init__(**kwargs)
|
||||
|
||||
def on_long_touch(self, *args) -> None:
|
||||
if self.active:
|
||||
return
|
||||
self.active = True if not self.active else False
|
||||
|
||||
def on_active(self, instance_check, active_value: bool) -> None:
|
||||
if active_value:
|
||||
self.do_animation_check((0, 0, 0, 0.4), 1)
|
||||
else:
|
||||
self.do_animation_check((0, 0, 0, 0), 0)
|
||||
|
||||
def do_animation_check(self, md_bg_color: list, scale_value: int) -> None:
|
||||
Animation(md_bg_color=md_bg_color, t="out_sine", d=0.1).start(
|
||||
self.ids.icon_left_box
|
||||
)
|
||||
Animation(
|
||||
scale_value_x=scale_value,
|
||||
scale_value_y=scale_value,
|
||||
scale_value_z=scale_value,
|
||||
t="out_sine",
|
||||
d=0.1,
|
||||
).start(self.ids.check_icon)
|
||||
|
||||
if not self.icon_left:
|
||||
if scale_value:
|
||||
self.ids.check_icon.x = -dp(4)
|
||||
Animation(size=(dp(24), dp(24)), t="out_sine", d=0.1).start(
|
||||
self.ids.relative_box
|
||||
)
|
||||
else:
|
||||
self.ids.check_icon.x = 0
|
||||
Animation(size=(0, 0), t="out_sine", d=0.1).start(
|
||||
self.ids.relative_box
|
||||
)
|
||||
|
||||
def on_press(self, *args):
|
||||
if self.active:
|
||||
self.active = False
|
||||
|
||||
|
||||
class MDChooseChip(MDStackLayout):
|
||||
def __init__(self, **kwargs):
|
||||
super().__init__(**kwargs)
|
||||
Logger.warning(
|
||||
"MDChooseChip: "
|
||||
"class is deprecated and will be removed in a future version"
|
||||
)
|
||||
|
||||
|
||||
class MDScalableCheckIcon(MDIcon, ScaleWidget):
|
||||
pos_hint = {"center_y": 0.5}
|
||||
|
||||
|
||||
if __name__ == "__main__":
|
||||
from kivymd.app import MDApp
|
||||
from kivymd.uix.screen import MDScreen
|
||||
|
||||
KV = """
|
||||
<MyScreen>
|
||||
|
||||
MDBoxLayout:
|
||||
orientation: "vertical"
|
||||
adaptive_size: True
|
||||
spacing: "12dp"
|
||||
padding: "56dp"
|
||||
pos_hint: {"center_x": .5, "center_y": .5}
|
||||
|
||||
MDLabel:
|
||||
text: "Multiple choose"
|
||||
bold: True
|
||||
font_style: "H5"
|
||||
adaptive_size: True
|
||||
|
||||
MDBoxLayout:
|
||||
id: chip_box
|
||||
adaptive_size: True
|
||||
spacing: "8dp"
|
||||
|
||||
MyChip:
|
||||
text: "Elevator"
|
||||
on_press: if self.active: root.removes_marks_all_chips()
|
||||
|
||||
MyChip:
|
||||
text: "Washer / Dryer"
|
||||
on_press: if self.active: root.removes_marks_all_chips()
|
||||
|
||||
MyChip:
|
||||
text: "Fireplace"
|
||||
on_press: if self.active: root.removes_marks_all_chips()
|
||||
|
||||
MDSeparator:
|
||||
|
||||
MDLabel:
|
||||
text: "Only choose"
|
||||
bold: True
|
||||
font_style: "H5"
|
||||
adaptive_size: True
|
||||
|
||||
MDBoxLayout:
|
||||
id: chip_only_box
|
||||
adaptive_size: True
|
||||
spacing: "8dp"
|
||||
|
||||
MyChip:
|
||||
text: "Elevator"
|
||||
on_active: if self.active: root.removes_marks_all_chips(self, False)
|
||||
|
||||
MyChip:
|
||||
text: "Washer / Dryer"
|
||||
on_active: if self.active: root.removes_marks_all_chips(self, False)
|
||||
|
||||
MyChip:
|
||||
text: "Fireplace"
|
||||
on_active: if self.active: root.removes_marks_all_chips(self, False)
|
||||
|
||||
|
||||
ScreenManager:
|
||||
|
||||
MyScreen:
|
||||
"""
|
||||
|
||||
class MyChip(MDChip):
|
||||
icon_check_color = (0, 0, 0, 1)
|
||||
text_color = (0, 0, 0, 0.5)
|
||||
_no_ripple_effect = True
|
||||
|
||||
def __init__(self, **kwargs):
|
||||
super().__init__(**kwargs)
|
||||
self.bind(active=self.set_chip_bg_color)
|
||||
self.bind(active=self.set_chip_text_color)
|
||||
|
||||
def set_chip_bg_color(self, instance_chip, active_value: int):
|
||||
"""
|
||||
Will be called every time the chip is activated/deactivated.
|
||||
Sets the background color of the chip.
|
||||
"""
|
||||
|
||||
self.md_bg_color = (
|
||||
(0, 0, 0, 0.4)
|
||||
if active_value
|
||||
else (
|
||||
self.theme_cls.bg_darkest
|
||||
if self.theme_cls.theme_style == "Light"
|
||||
else (
|
||||
self.theme_cls.bg_light
|
||||
if not self.disabled
|
||||
else self.theme_cls.disabled_hint_text_color
|
||||
)
|
||||
)
|
||||
)
|
||||
|
||||
def set_chip_text_color(self, instance_chip, active_value: int):
|
||||
Animation(
|
||||
color=(0, 0, 0, 1) if active_value else (0, 0, 0, 0.5), d=0.2
|
||||
).start(self.ids.label)
|
||||
|
||||
class MyScreen(MDScreen):
|
||||
def removes_marks_all_chips(
|
||||
self, selected_instance_chip=None, multiple=True
|
||||
):
|
||||
if multiple:
|
||||
for instance_chip in self.ids.chip_box.children:
|
||||
if instance_chip.active:
|
||||
instance_chip.active = False
|
||||
else:
|
||||
for instance_chip in self.ids.chip_only_box.children:
|
||||
if instance_chip != selected_instance_chip:
|
||||
instance_chip.active = False
|
||||
|
||||
class Test(MDApp):
|
||||
def build(self):
|
||||
return Builder.load_string(KV)
|
||||
|
||||
Test().run()
|
||||
Loading…
Add table
Add a link
Reference in a new issue