Learn what Felgo offers to help your business succeed. Start your free evaluation today! Felgo for Your Business

Forums

OverviewFelgo 2 Support (Qt 5) › Mouse Area Issue with leftBarItem: IconButtonBarItem { }

Viewing 3 posts - 1 through 3 (of 3 total)
  • Author
    Posts
  • #19963

    Jonathan

    I’m setting up a Felgo App that has both TabControl and a Side Drawer Navigation for all platforms (each with a different mix of navigation items).

    To open the Side Drawer, I’m using IconButtonBarItem on the first page of each major section, but the clickable area seems to not include the icon itself and consists of an invisible sliver of the navigation bar just to the right of the icon. This is true for all platform themes. Below is a simplified reconstruction of my app.

    Main.qml

    import Felgo 3.0
    import QtQuick 2.0
    
    App {    
        id: app
        onInitTheme: { // Custom theme settings }
        MainPage { }
    }

     

    MainPage.qml

    import Felgo 3.0
    import QtQuick 2.0
    import "pages"
    
    Page {
        id: mainPage
        SideNav { id: sideNav }
        TabControl {
            tabPosition: Qt.BottomEdge
            showIcon: true
            NavigationItem {
                icon: IconType.briefcase
                AccountsPage { }
            }
            NavigationItem {
                icon: IconType.arrowdown
                ReceivePage { }
            }
            NavigationItem {
                icon: IconType.arrowup
                SendPage { }
            }
            NavigationItem {
                icon: IconType.thlist
                ActivityPage { }
            }
        }
    }

     

    pages/AccountsPage.qml

    import Felgo 3.0
    import QtQuick 2.0
    
    NavigationStack {
        id: stack
        Page {
            title: qsTr("Accounts")
    
            leftBarItem: IconButtonBarItem {  // <-- ICON NOT CLICKABLE
                icon: IconType.bars
                onClicked: sideNav.open()
            }
            // Page contents
        }
    }

     

    pages/SideNav.qml

    import Felgo 3.0
    import QtQuick 2.0
    
    AppDrawer {
        id: sideNav
        z: 1
        // SideNav content
        }
    }
    

     

    #19964

    Jonathan

    UPDATE:

    I figured out the issue. The width of the AppDrawer.slideInDist property was obscuring the left navigation button. When I adjusted the width down to dp(16), it was no longer in the way.

    #19975

    Günther
    Felgo Team

    Hi Jonathan,

    your solution is correct. When dealing with multiple items that receive touch input by e.g. using a MouseArea, overlapping touch areas can prevents touch input from going through to underlying components.

    For the drawer, the slideInDist property sets the size of the touch-area for the drawer slide-in gesture.

Viewing 3 posts - 1 through 3 (of 3 total)

RSS feed for this thread

You must be logged in to reply to this topic.

Qt_Technology_Partner_RGB_475 Qt_Service_Partner_RGB_475_padded