Quick search

Bubble

New in version 1.1.0.

_images/bubble.jpg

The Bubble widget is a form of menu or a small popup where the menu options are stacked either vertically or horizontally.

The Bubble contains an arrow pointing towards the direction you choose.

Simple example

'''
Bubble
======

Test of the widget Bubble.
'''

from kivy.app import App
from kivy.uix.floatlayout import FloatLayout
from kivy.uix.button import Button
from kivy.lang import Builder
from kivy.uix.bubble import Bubble

Builder.load_string('''
<cut_copy_paste>
    size_hint: (None, None)
    size: (150, 50)
    pos_hint: {'center_x': .5, 'y': .6}
    arrow_pos: 'bottom_mid'
    orientation: 'horizontal'
    BubbleButton:
        text: 'Cut'
    BubbleButton:
        text: 'Copy'
    BubbleButton:
        text: 'Paste'
''')


class cut_copy_paste(Bubble):
    pass


class BubbleShowcase(FloatLayout):

    def __init__(self, **kwargs):
        super(BubbleShowcase, self).__init__(**kwargs)
        self.but_bubble = Button(text='Press to show bubble')
        self.but_bubble.bind(on_release=self.show_bubble)
        self.add_widget(self.but_bubble)

    def show_bubble(self, *l):
        if not hasattr(self, 'bubb'):
            self.bubb = bubb = cut_copy_paste()
            self.add_widget(bubb)
        else:
            values = ('left_top', 'left_mid', 'left_bottom', 'top_left',
                'top_mid', 'top_right', 'right_top', 'right_mid',
                'right_bottom', 'bottom_left', 'bottom_mid', 'bottom_right')
            index = values.index(self.bubb.arrow_pos)
            self.bubb.arrow_pos = values[(index + 1) % len(values)]


class TestBubbleApp(App):

    def build(self):
        return BubbleShowcase()

if __name__ == '__main__':
    TestBubbleApp().run()

Customize the Bubble

You can choose the direction the arrow points towards:

Bubble(arrow_pos='top_mid')

The widgets added to Bubble are orderd by default horizontally as in a Boxlayout. You can change that by:

orientation = 'vertical'

Add Items to the bubble:

bubble = Bubble(orientation = 'vertical')
bubble.add_widget(your_widget_instance)

Remove Items:

bubble.remove_widget(Widget)
or
bubble.clear_widgets()

Access children list, Warning This is important! Use content.children to access the children list:

bubble.content.children

Change Appearance of the bubble:

bubble.background_color = (1, 0, 0, .5) #50% translucent red
bubble.border = [0, 0, 0, 0]
background_image = 'path/to/background/image'
arrow_image = 'path/to/arrow/image'
class kivy.uix.bubble.Bubble(**kwargs)

Bases: kivy.uix.gridlayout.GridLayout

Bubble class. See module documentation for more information.

arrow_image

Image of the arrow pointing to the bubble.

arrow_image is a StringProperty, default to ‘atlas://data/images/defaulttheme/bubble_arrow’.

arrow_pos

Specifies the position of the arrow relative to the bubble. Can be one of: left_top, left_mid, left_bottom top_left, top_mid, top_right right_top, right_mid, right_bottom bottom_left, bottom_mid, bottom_right.

arrow_pos is a OptionProperty, default to ‘bottom_mid’.

background_color

Background color, in the format (r, g, b, a).

background_color is a ListProperty, default to [1, 1, 1, 1].

background_image

Background image of the bubble.

background_image is a StringProperty, default to ‘atlas://data/images/defaulttheme/bubble’.

border

Border used for BorderImage graphics instruction. Used for background_image. Can be used when using custom background.

It must be a list of 4 values: (top, right, bottom, left). Read the BorderImage instructions for more information about how to use it.

border is a ListProperty, default to (16, 16, 16, 16)

content

This is the object where the main content of the bubble is held.

content is a ObjectProperty, default to ‘None’.

limit_to

Specifies the widget to which the bubbles position is limited.

New in version 1.6.0.

limit_to is a ObjectProperty, default to ‘None’.

orientation

This specifies the manner in which the children inside bubble are arranged. Can be one of ‘vertical’, ‘horizontal’

orientation is a OptionProperty, default to ‘horizontal’.

class kivy.uix.bubble.BubbleButton(**kwargs)

Bases: kivy.uix.button.Button

A button intended for use as in a Bubble widget. You can use a “normal” button class, but it will not look good, unless the background is changed.

Instead, you can use this BubbleButton widget that already defined the good background for you.