Action Bar Setup

405 views
Skip to first unread message

Shoumik Das

unread,
May 5, 2020, 11:37:27 AM5/5/20
to Kivy users support
Hi, I am trying to build a screen with an action bar on top and a tabbed panel below with 3 tabs. I used the following code. My app runs fine but when it reaches the desired screen with action bar, it simply closes. The error message is as follows:

if not self.action_previous.parent:
 AttributeError: 'NoneType' object has no attribute 'parent'


Kivy code:

<SivaTabbedScreen>:
    name: 'tabbed_screen'
    canvas.before:
        Color:
            rgba: 255/255, 255/255, 255/255, 1
        Rectangle:
            pos: self.pos
            size: self.size
    BoxLayout:
        id: master_layout
        orientation: 'vertical'
        size_hint: 1, 1
        ActionBar:
            id: master_actionbar
            pos_hint: {'top':1}
            ActionView:
                use_separator: True


I was referring to the following link for guidance: https://github.com/kivy/kivy/blob/master/examples/widgets/actionbar.py

I have added the following line in Python: from kivy.uix.actionbar import ActionBar

What is the purpose of the 'ActionPrevious:' attribute?

I was planning to setup a master box layout with vertical orientation. A small 20% width box on top to house the action bar and the remaining 80% width for the tabbed panel. Does this layout scheme look fine?

Please advise.

Thanks in advance

Elliot Garbus

unread,
May 5, 2020, 12:49:21 PM5/5/20
to kivy-...@googlegroups.com

The Action Previous is the section on the left of the Actionbar below.

 

 

Here is a portion of the actionbar code from this program:

 

ActionBar:
    pos_hint: {'top':1}
    ActionView:
        ActionPrevious:
            title: "Editor & Librarian"
            app_icon: 'ottobit O 128.png'
            with_previous: 'editor' != root.ids.sm.current
            on_press:
                root.ids.sm.current = 'editor' if 'editor' != root.ids.sm.current else 'librarian'
                root.ids.sm.transition.direction = 'left' if 'editor' != root.ids.sm.current else 'right'
        ActionButton:
            text: 'Editor'
            on_press:
                root.ids.sm.current = 'editor'
                root.ids.sm.transition.direction = 'right'
        ActionButton:
            text: 'Librarian'
            # color: 1,.2,1,1
            on_press:
                root.ids.sm.current = 'librarian'
                root.ids.sm.transition.direction = 'left'

 

 

The ActionPrevious provides the icon, title, and ability to use the ActionPrevious button as a navigation tool.

--
You received this message because you are subscribed to the Google Groups "Kivy users support" group.
To unsubscribe from this group and stop receiving emails from it, send an email to kivy-users+...@googlegroups.com.
To view this discussion on the web visit https://groups.google.com/d/msgid/kivy-users/5cb0c735-8f02-4ae1-9a8c-419ecfda5e88%40googlegroups.com.

 

Shoumik Das

unread,
May 6, 2020, 6:45:49 AM5/6/20
to Kivy users support
Hi Eliott,

Thanks for the suggestion. I managed to set up an action bar with a FloatLayout. It seems that BoxLayout does not honor pos_hint. Now my action stays fixed at the top. I also added a tabbed panel below the action bar.


However, when I resize my app window, the tabbed panel overlaps with the action bar. This is probably because I am using a FloatLayout. How can I arrange my action bar and tabbed panel so that they do not overlap each other when the app screen is resized? I tried with a box layout but it leaves some space above the action bar. Can relative layouts help here? I want my tabbed panel to sit just below my action bar even when my app window is resized. The panel should occupy as much screen space as possible without overlapping the action bar.


Following is my Kivy code:

<SivaTabbedScreen>:
    name: 'tabbed_screen'
    canvas.before:
        Color:
            rgba: 255/255, 255/255, 255/255, 1
        Rectangle:
            pos: self.pos
            size: self.size
    FloatLayout:
        id: master_layout

        size_hint: 1, 1
        ActionBar:
            id: master_actionbar
            pos_hint: {'top': 1}
            background_image: ''
            background_color: 195/255, 60/255, 35/255, 1
            ActionView:
                use_separator: True
                ActionPrevious:
                    title: 'S.I.V.A'
                    with_previous: False
                ActionOverflow:
                ActionButton:
                    icon: 'atlas://data/images/defaulttheme/audio-volume-high'
                ActionButton:
                    important: True
                    text: 'Important'
                ActionButton:
                    text: 'Btn2'
                ActionButton:
                    text: 'Btn3'
                ActionButton:
                    text: 'Btn4'
                ActionGroup:
                    text: 'Group1'
                    ActionButton:
                        text: 'Btn5'
                    ActionButton:
                        text: 'Btn6'
                    ActionButton:
                        text: 'Btn7'
        TabbedPanel:
            id: main_panel
            size_hint: 0.8, 0.8
            pos_hint: {'center_x': 0.5, 'center_y': 0.5}
            background_color: 195/255, 60/255, 35/255, 1
            background_image: ''
            do_default_tab: False
            TabbedPanelItem:
                text: 'Tab 1'
                Label:
                    text: 'First Tab'
            TabbedPanelItem:
                text: 'Tab 2'
                BoxLayout:
                    orientation: 'vertical'
                    Label:
                        text: 'Second Tab'
                    Button:
                        text: 'Click it'
            TabbedPanelItem:
                text: 'Tab 3'
                Label:
                    text: 'Third Tab'

Please advise.

Thanks in advance.

To unsubscribe from this group and stop receiving emails from it, send an email to kivy-...@googlegroups.com.

Elliot Garbus

unread,
May 6, 2020, 12:39:08 PM5/6/20
to kivy-...@googlegroups.com

You can put the action bar in a box layout, you just need things under it to have it be on the top.  That would be my first choice.

 

If you want to use a FloatLayout, Make the position/height of the tabbed panel be calculated based on the position of the ActionBar.

Assuming you have only the action bar and tabbed panel.  The height of the tabbed panel is the window height – height of the action bar.

To unsubscribe from this group and stop receiving emails from it, send an email to kivy-users+...@googlegroups.com.
To view this discussion on the web visit https://groups.google.com/d/msgid/kivy-users/81f6ac6a-c825-4c08-8d0d-acaa0880ca16%40googlegroups.com.

 

Shoumik Das

unread,
May 7, 2020, 1:15:24 AM5/7/20
to Kivy users support
Thanks for the advice. :)
Reply all
Reply to author
Forward
0 new messages