├── images ├── black │ ├── bus.png │ ├── car.png │ ├── bus@2x.png │ ├── bus@3x.png │ ├── bus@4x.png │ ├── car@2x.png │ ├── car@3x.png │ ├── car@4x.png │ ├── done.png │ ├── flight.png │ ├── home.png │ ├── person.png │ ├── subway.png │ ├── truck.png │ ├── done@2x.png │ ├── done@3x.png │ ├── done@4x.png │ ├── home@2x.png │ ├── home@3x.png │ ├── home@4x.png │ ├── settings.png │ ├── truck@2x.png │ ├── truck@3x.png │ ├── truck@4x.png │ ├── x18 │ │ ├── bus.png │ │ ├── car.png │ │ ├── done.png │ │ ├── home.png │ │ ├── bus@2x.png │ │ ├── bus@3x.png │ │ ├── bus@4x.png │ │ ├── car@2x.png │ │ ├── car@3x.png │ │ ├── car@4x.png │ │ ├── done@2x.png │ │ ├── done@3x.png │ │ ├── done@4x.png │ │ ├── flight.png │ │ ├── home@2x.png │ │ ├── home@3x.png │ │ ├── home@4x.png │ │ ├── person.png │ │ ├── subway.png │ │ ├── truck.png │ │ ├── flight@2x.png │ │ ├── flight@3x.png │ │ ├── flight@4x.png │ │ ├── person@2x.png │ │ ├── person@3x.png │ │ ├── person@4x.png │ │ ├── settings.png │ │ ├── subway@2x.png │ │ ├── subway@3x.png │ │ ├── subway@4x.png │ │ ├── truck@2x.png │ │ ├── truck@3x.png │ │ ├── truck@4x.png │ │ ├── arrow_back.png │ │ ├── directions.png │ │ ├── settings@2x.png │ │ ├── settings@3x.png │ │ ├── settings@4x.png │ │ ├── arrow_back@2x.png │ │ ├── arrow_back@3x.png │ │ ├── arrow_back@4x.png │ │ ├── directions@2x.png │ │ ├── directions@3x.png │ │ └── directions@4x.png │ ├── x36 │ │ ├── bus.png │ │ ├── car.png │ │ ├── done.png │ │ ├── home.png │ │ ├── bus@2x.png │ │ ├── bus@3x.png │ │ ├── bus@4x.png │ │ ├── car@2x.png │ │ ├── car@3x.png │ │ ├── car@4x.png │ │ ├── done@2x.png │ │ ├── done@3x.png │ │ ├── done@4x.png │ │ ├── flight.png │ │ ├── home@2x.png │ │ ├── home@3x.png │ │ ├── home@4x.png │ │ ├── person.png │ │ ├── subway.png │ │ ├── truck.png │ │ ├── flight@2x.png │ │ ├── flight@3x.png │ │ ├── flight@4x.png │ │ ├── person@2x.png │ │ ├── person@3x.png │ │ ├── person@4x.png │ │ ├── settings.png │ │ ├── subway@2x.png │ │ ├── subway@3x.png │ │ ├── subway@4x.png │ │ ├── truck@2x.png │ │ ├── truck@3x.png │ │ ├── truck@4x.png │ │ ├── arrow_back.png │ │ ├── directions.png │ │ ├── settings@2x.png │ │ ├── settings@3x.png │ │ ├── settings@4x.png │ │ ├── arrow_back@2x.png │ │ ├── arrow_back@3x.png │ │ ├── arrow_back@4x.png │ │ ├── directions@2x.png │ │ ├── directions@3x.png │ │ └── directions@4x.png │ ├── x48 │ │ ├── bus.png │ │ ├── car.png │ │ ├── done.png │ │ ├── home.png │ │ ├── bus@2x.png │ │ ├── bus@3x.png │ │ ├── bus@4x.png │ │ ├── car@2x.png │ │ ├── car@3x.png │ │ ├── car@4x.png │ │ ├── done@2x.png │ │ ├── done@3x.png │ │ ├── done@4x.png │ │ ├── flight.png │ │ ├── home@2x.png │ │ ├── home@3x.png │ │ ├── home@4x.png │ │ ├── person.png │ │ ├── subway.png │ │ ├── truck.png │ │ ├── flight@2x.png │ │ ├── flight@3x.png │ │ ├── flight@4x.png │ │ ├── person@2x.png │ │ ├── person@3x.png │ │ ├── person@4x.png │ │ ├── settings.png │ │ ├── subway@2x.png │ │ ├── subway@3x.png │ │ ├── subway@4x.png │ │ ├── truck@2x.png │ │ ├── truck@3x.png │ │ ├── truck@4x.png │ │ ├── arrow_back.png │ │ ├── directions.png │ │ ├── directions@4.png │ │ ├── settings@2x.png │ │ ├── settings@3x.png │ │ ├── settings@4x.png │ │ ├── arrow_back@2x.png │ │ ├── arrow_back@3x.png │ │ ├── arrow_back@4x.png │ │ ├── directions@2x.png │ │ └── directions@3x.png │ ├── arrow_back.png │ ├── directions.png │ ├── flight@2x.png │ ├── flight@3x.png │ ├── flight@4x.png │ ├── more_vert.png │ ├── person@2x.png │ ├── person@3x.png │ ├── person@4x.png │ ├── settings@2x.png │ ├── settings@3x.png │ ├── settings@4x.png │ ├── subway@2x.png │ ├── subway@3x.png │ ├── subway@4x.png │ ├── arrow_back@2x.png │ ├── arrow_back@3x.png │ ├── arrow_back@4x.png │ ├── directions@2x.png │ ├── directions@3x.png │ ├── directions@4x.png │ ├── more_vert@2x.png │ ├── more_vert@3x.png │ └── more_vert@4x.png └── white │ ├── bus.png │ ├── car.png │ ├── bus@2x.png │ ├── bus@3x.png │ ├── bus@4x.png │ ├── car@2x.png │ ├── car@3x.png │ ├── car@4x.png │ ├── done.png │ ├── flight.png │ ├── home.png │ ├── person.png │ ├── subway.png │ ├── truck.png │ ├── done@2x.png │ ├── done@3x.png │ ├── done@4x.png │ ├── home@2x.png │ ├── home@3x.png │ ├── home@4x.png │ ├── settings.png │ ├── truck@2x.png │ ├── truck@3x.png │ ├── truck@4x.png │ ├── x18 │ ├── bus.png │ ├── car.png │ ├── done.png │ ├── home.png │ ├── bus@2x.png │ ├── bus@3x.png │ ├── bus@4x.png │ ├── car@2x.png │ ├── car@3x.png │ ├── car@4x.png │ ├── done@2x.png │ ├── done@3x.png │ ├── done@4x.png │ ├── flight.png │ ├── home@2x.png │ ├── home@3x.png │ ├── home@4x.png │ ├── person.png │ ├── subway.png │ ├── truck.png │ ├── flight@2x.png │ ├── flight@3x.png │ ├── flight@4x.png │ ├── person@2x.png │ ├── person@3x.png │ ├── person@4x.png │ ├── settings.png │ ├── subway@2x.png │ ├── subway@3x.png │ ├── subway@4x.png │ ├── truck@2x.png │ ├── truck@3x.png │ ├── truck@4x.png │ ├── arrow_back.png │ ├── directions.png │ ├── settings@2x.png │ ├── settings@3x.png │ ├── settings@4x.png │ ├── arrow_back@2x.png │ ├── arrow_back@3x.png │ ├── arrow_back@4x.png │ ├── directions@2x.png │ ├── directions@3x.png │ └── directions@4x.png │ ├── x36 │ ├── bus.png │ ├── car.png │ ├── done.png │ ├── home.png │ ├── bus@2x.png │ ├── bus@3x.png │ ├── bus@4x.png │ ├── car@2x.png │ ├── car@3x.png │ ├── car@4x.png │ ├── done@2x.png │ ├── done@3x.png │ ├── done@4x.png │ ├── flight.png │ ├── home@2x.png │ ├── home@3x.png │ ├── home@4x.png │ ├── person.png │ ├── subway.png │ ├── truck.png │ ├── flight@2x.png │ ├── flight@3x.png │ ├── flight@4x.png │ ├── person@2x.png │ ├── person@3x.png │ ├── person@4x.png │ ├── settings.png │ ├── subway@2x.png │ ├── subway@3x.png │ ├── subway@4x.png │ ├── truck@2x.png │ ├── truck@3x.png │ ├── truck@4x.png │ ├── arrow_back.png │ ├── directions.png │ ├── settings@2x.png │ ├── settings@3x.png │ ├── settings@4x.png │ ├── arrow_back@2x.png │ ├── arrow_back@3x.png │ ├── arrow_back@4x.png │ ├── directions@2x.png │ ├── directions@3x.png │ └── directions@4x.png │ ├── x48 │ ├── bus.png │ ├── car.png │ ├── done.png │ ├── home.png │ ├── bus@2x.png │ ├── bus@3x.png │ ├── bus@4x.png │ ├── car@2x.png │ ├── car@3x.png │ ├── car@4x.png │ ├── done@2x.png │ ├── done@3x.png │ ├── done@4x.png │ ├── flight.png │ ├── home@2x.png │ ├── home@3x.png │ ├── home@4x.png │ ├── person.png │ ├── subway.png │ ├── truck.png │ ├── flight@2x.png │ ├── flight@3x.png │ ├── flight@4x.png │ ├── person@2x.png │ ├── person@3x.png │ ├── person@4.png │ ├── settings.png │ ├── subway@2x.png │ ├── subway@3x.png │ ├── subway@4x.png │ ├── truck@2x.png │ ├── truck@3x.png │ ├── truck@4x.png │ ├── arrow_back.png │ ├── arrow_back@4.png │ ├── directions.png │ ├── settings@2x.png │ ├── settings@3x.png │ ├── settings@4x.png │ ├── arrow_back@2x.png │ ├── arrow_back@3x.png │ ├── directions@2x.png │ ├── directions@3x.png │ └── directions@4x.png │ ├── arrow_back.png │ ├── directions.png │ ├── flight@2x.png │ ├── flight@3x.png │ ├── flight@4x.png │ ├── more_vert.png │ ├── person@2x.png │ ├── person@3x.png │ ├── person@4x.png │ ├── settings@2x.png │ ├── settings@3x.png │ ├── settings@4x.png │ ├── subway@2x.png │ ├── subway@3x.png │ ├── subway@4x.png │ ├── arrow_back@2x.png │ ├── arrow_back@3x.png │ ├── arrow_back@4x.png │ ├── directions@2x.png │ ├── directions@3x.png │ ├── directions@4x.png │ ├── more_vert@2x.png │ ├── more_vert@3x.png │ └── more_vert@4x.png ├── common ├── LabelBody.qml ├── LabelBodySecondary.qml ├── LabelTitle.qml ├── LabelDisplay4.qml ├── LabelDisplay1.qml ├── LabelDisplay2.qml ├── LabelDisplay3.qml ├── LabelHeadline.qml ├── LabelSubheading.qml ├── LabelCaption.qml ├── HorizontalDivider.qml ├── SwitchWithLeftLabel.qml ├── VerticalDivider.qml ├── ButtonIconActive.qml ├── IconActive.qml ├── IconInactive.qml ├── ButtonFlat.qml ├── FloatingActionMiniButton.qml ├── FloatingActionButton.qml ├── IconColored.qml ├── ButtonRaised.qml ├── SimpleTextTitle.qml ├── StackTextTitle.qml └── SwipeTextTitle.qml ├── translations.qrc ├── deployment.pri ├── .gitignore ├── AUTHOR.md ├── applicationui.hpp ├── tabs ├── TitleAndIconTabBar.qml ├── TitleAndTabBar.qml ├── TabButtonIcon.qml ├── TitleAndIconTextTabBar.qml ├── TabButtonTextAndIcon.qml ├── TitleWithIconTabBar.qml ├── TitleWithIconTextTabBar.qml └── TitleWithTabBar.qml ├── main.cpp ├── LICENSE ├── popups ├── PopupInfo.qml ├── PopupPalette.qml └── PopupSettings.qml ├── qml.qrc ├── tab_pages_x.pro ├── README.md ├── pages ├── PageFour.qml ├── PageThree.qml ├── PageOne.qml ├── PageTwo.qml └── PageFive.qml ├── applicationui.cpp ├── uiconstants.hpp ├── main.qml └── images.qrc /images/black/bus.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/bus.png -------------------------------------------------------------------------------- /images/black/car.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/car.png -------------------------------------------------------------------------------- /images/white/bus.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/bus.png -------------------------------------------------------------------------------- /images/white/car.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/car.png -------------------------------------------------------------------------------- /images/black/bus@2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/bus@2x.png -------------------------------------------------------------------------------- /images/black/bus@3x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/bus@3x.png -------------------------------------------------------------------------------- /images/black/bus@4x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/bus@4x.png -------------------------------------------------------------------------------- /images/black/car@2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/car@2x.png -------------------------------------------------------------------------------- /images/black/car@3x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/car@3x.png -------------------------------------------------------------------------------- /images/black/car@4x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/car@4x.png -------------------------------------------------------------------------------- /images/black/done.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/done.png -------------------------------------------------------------------------------- /images/black/flight.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/flight.png -------------------------------------------------------------------------------- /images/black/home.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/home.png -------------------------------------------------------------------------------- /images/black/person.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/person.png -------------------------------------------------------------------------------- /images/black/subway.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/subway.png -------------------------------------------------------------------------------- /images/black/truck.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/truck.png -------------------------------------------------------------------------------- /images/white/bus@2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/bus@2x.png -------------------------------------------------------------------------------- /images/white/bus@3x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/bus@3x.png -------------------------------------------------------------------------------- /images/white/bus@4x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/bus@4x.png -------------------------------------------------------------------------------- /images/white/car@2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/car@2x.png -------------------------------------------------------------------------------- /images/white/car@3x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/car@3x.png -------------------------------------------------------------------------------- /images/white/car@4x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/car@4x.png -------------------------------------------------------------------------------- /images/white/done.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/done.png -------------------------------------------------------------------------------- /images/white/flight.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/flight.png -------------------------------------------------------------------------------- /images/white/home.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/home.png -------------------------------------------------------------------------------- /images/white/person.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/person.png -------------------------------------------------------------------------------- /images/white/subway.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/subway.png -------------------------------------------------------------------------------- /images/white/truck.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/truck.png -------------------------------------------------------------------------------- /images/black/done@2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/done@2x.png -------------------------------------------------------------------------------- /images/black/done@3x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/done@3x.png -------------------------------------------------------------------------------- /images/black/done@4x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/done@4x.png -------------------------------------------------------------------------------- /images/black/home@2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/home@2x.png -------------------------------------------------------------------------------- /images/black/home@3x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/home@3x.png -------------------------------------------------------------------------------- /images/black/home@4x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/home@4x.png -------------------------------------------------------------------------------- /images/black/settings.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/settings.png -------------------------------------------------------------------------------- /images/black/truck@2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/truck@2x.png -------------------------------------------------------------------------------- /images/black/truck@3x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/truck@3x.png -------------------------------------------------------------------------------- /images/black/truck@4x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/truck@4x.png -------------------------------------------------------------------------------- /images/black/x18/bus.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/x18/bus.png -------------------------------------------------------------------------------- /images/black/x18/car.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/x18/car.png -------------------------------------------------------------------------------- /images/black/x18/done.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/x18/done.png -------------------------------------------------------------------------------- /images/black/x18/home.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/x18/home.png -------------------------------------------------------------------------------- /images/black/x36/bus.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/x36/bus.png -------------------------------------------------------------------------------- /images/black/x36/car.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/x36/car.png -------------------------------------------------------------------------------- /images/black/x36/done.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/x36/done.png -------------------------------------------------------------------------------- /images/black/x36/home.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/x36/home.png -------------------------------------------------------------------------------- /images/black/x48/bus.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/x48/bus.png -------------------------------------------------------------------------------- /images/black/x48/car.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/x48/car.png -------------------------------------------------------------------------------- /images/black/x48/done.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/x48/done.png -------------------------------------------------------------------------------- /images/black/x48/home.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/x48/home.png -------------------------------------------------------------------------------- /images/white/done@2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/done@2x.png -------------------------------------------------------------------------------- /images/white/done@3x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/done@3x.png -------------------------------------------------------------------------------- /images/white/done@4x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/done@4x.png -------------------------------------------------------------------------------- /images/white/home@2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/home@2x.png -------------------------------------------------------------------------------- /images/white/home@3x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/home@3x.png -------------------------------------------------------------------------------- /images/white/home@4x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/home@4x.png -------------------------------------------------------------------------------- /images/white/settings.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/settings.png -------------------------------------------------------------------------------- /images/white/truck@2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/truck@2x.png -------------------------------------------------------------------------------- /images/white/truck@3x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/truck@3x.png -------------------------------------------------------------------------------- /images/white/truck@4x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/truck@4x.png -------------------------------------------------------------------------------- /images/white/x18/bus.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/x18/bus.png -------------------------------------------------------------------------------- /images/white/x18/car.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/x18/car.png -------------------------------------------------------------------------------- /images/white/x18/done.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/x18/done.png -------------------------------------------------------------------------------- /images/white/x18/home.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/x18/home.png -------------------------------------------------------------------------------- /images/white/x36/bus.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/x36/bus.png -------------------------------------------------------------------------------- /images/white/x36/car.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/x36/car.png -------------------------------------------------------------------------------- /images/white/x36/done.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/x36/done.png -------------------------------------------------------------------------------- /images/white/x36/home.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/x36/home.png -------------------------------------------------------------------------------- /images/white/x48/bus.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/x48/bus.png -------------------------------------------------------------------------------- /images/white/x48/car.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/x48/car.png -------------------------------------------------------------------------------- /images/white/x48/done.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/x48/done.png -------------------------------------------------------------------------------- /images/white/x48/home.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/x48/home.png -------------------------------------------------------------------------------- /images/black/arrow_back.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/arrow_back.png -------------------------------------------------------------------------------- /images/black/directions.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/directions.png -------------------------------------------------------------------------------- /images/black/flight@2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/flight@2x.png -------------------------------------------------------------------------------- /images/black/flight@3x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/flight@3x.png -------------------------------------------------------------------------------- /images/black/flight@4x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/flight@4x.png -------------------------------------------------------------------------------- /images/black/more_vert.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/more_vert.png -------------------------------------------------------------------------------- /images/black/person@2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/person@2x.png -------------------------------------------------------------------------------- /images/black/person@3x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/person@3x.png -------------------------------------------------------------------------------- /images/black/person@4x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/person@4x.png -------------------------------------------------------------------------------- /images/black/settings@2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/settings@2x.png -------------------------------------------------------------------------------- /images/black/settings@3x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/settings@3x.png -------------------------------------------------------------------------------- /images/black/settings@4x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/settings@4x.png -------------------------------------------------------------------------------- /images/black/subway@2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/subway@2x.png -------------------------------------------------------------------------------- /images/black/subway@3x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/subway@3x.png -------------------------------------------------------------------------------- /images/black/subway@4x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/subway@4x.png -------------------------------------------------------------------------------- /images/black/x18/bus@2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/x18/bus@2x.png -------------------------------------------------------------------------------- /images/black/x18/bus@3x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/x18/bus@3x.png -------------------------------------------------------------------------------- /images/black/x18/bus@4x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/x18/bus@4x.png -------------------------------------------------------------------------------- /images/black/x18/car@2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/x18/car@2x.png -------------------------------------------------------------------------------- /images/black/x18/car@3x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/x18/car@3x.png -------------------------------------------------------------------------------- /images/black/x18/car@4x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/x18/car@4x.png -------------------------------------------------------------------------------- /images/black/x18/done@2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/x18/done@2x.png -------------------------------------------------------------------------------- /images/black/x18/done@3x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/x18/done@3x.png -------------------------------------------------------------------------------- /images/black/x18/done@4x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/x18/done@4x.png -------------------------------------------------------------------------------- /images/black/x18/flight.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/x18/flight.png -------------------------------------------------------------------------------- /images/black/x18/home@2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/x18/home@2x.png -------------------------------------------------------------------------------- /images/black/x18/home@3x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/x18/home@3x.png -------------------------------------------------------------------------------- /images/black/x18/home@4x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/x18/home@4x.png -------------------------------------------------------------------------------- /images/black/x18/person.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/x18/person.png -------------------------------------------------------------------------------- /images/black/x18/subway.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/x18/subway.png -------------------------------------------------------------------------------- /images/black/x18/truck.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/x18/truck.png -------------------------------------------------------------------------------- /images/black/x36/bus@2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/x36/bus@2x.png -------------------------------------------------------------------------------- /images/black/x36/bus@3x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/x36/bus@3x.png -------------------------------------------------------------------------------- /images/black/x36/bus@4x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/x36/bus@4x.png -------------------------------------------------------------------------------- /images/black/x36/car@2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/x36/car@2x.png -------------------------------------------------------------------------------- /images/black/x36/car@3x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/x36/car@3x.png -------------------------------------------------------------------------------- /images/black/x36/car@4x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/x36/car@4x.png -------------------------------------------------------------------------------- /images/black/x36/done@2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/x36/done@2x.png -------------------------------------------------------------------------------- /images/black/x36/done@3x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/x36/done@3x.png -------------------------------------------------------------------------------- /images/black/x36/done@4x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/x36/done@4x.png -------------------------------------------------------------------------------- /images/black/x36/flight.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/x36/flight.png -------------------------------------------------------------------------------- /images/black/x36/home@2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/x36/home@2x.png -------------------------------------------------------------------------------- /images/black/x36/home@3x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/x36/home@3x.png -------------------------------------------------------------------------------- /images/black/x36/home@4x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/x36/home@4x.png -------------------------------------------------------------------------------- /images/black/x36/person.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/x36/person.png -------------------------------------------------------------------------------- /images/black/x36/subway.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/x36/subway.png -------------------------------------------------------------------------------- /images/black/x36/truck.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/x36/truck.png -------------------------------------------------------------------------------- /images/black/x48/bus@2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/x48/bus@2x.png -------------------------------------------------------------------------------- /images/black/x48/bus@3x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/x48/bus@3x.png -------------------------------------------------------------------------------- /images/black/x48/bus@4x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/x48/bus@4x.png -------------------------------------------------------------------------------- /images/black/x48/car@2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/x48/car@2x.png -------------------------------------------------------------------------------- /images/black/x48/car@3x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/x48/car@3x.png -------------------------------------------------------------------------------- /images/black/x48/car@4x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/x48/car@4x.png -------------------------------------------------------------------------------- /images/black/x48/done@2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/x48/done@2x.png -------------------------------------------------------------------------------- /images/black/x48/done@3x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/x48/done@3x.png -------------------------------------------------------------------------------- /images/black/x48/done@4x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/x48/done@4x.png -------------------------------------------------------------------------------- /images/black/x48/flight.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/x48/flight.png -------------------------------------------------------------------------------- /images/black/x48/home@2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/x48/home@2x.png -------------------------------------------------------------------------------- /images/black/x48/home@3x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/x48/home@3x.png -------------------------------------------------------------------------------- /images/black/x48/home@4x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/x48/home@4x.png -------------------------------------------------------------------------------- /images/black/x48/person.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/x48/person.png -------------------------------------------------------------------------------- /images/black/x48/subway.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/x48/subway.png -------------------------------------------------------------------------------- /images/black/x48/truck.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/x48/truck.png -------------------------------------------------------------------------------- /images/white/arrow_back.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/arrow_back.png -------------------------------------------------------------------------------- /images/white/directions.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/directions.png -------------------------------------------------------------------------------- /images/white/flight@2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/flight@2x.png -------------------------------------------------------------------------------- /images/white/flight@3x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/flight@3x.png -------------------------------------------------------------------------------- /images/white/flight@4x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/flight@4x.png -------------------------------------------------------------------------------- /images/white/more_vert.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/more_vert.png -------------------------------------------------------------------------------- /images/white/person@2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/person@2x.png -------------------------------------------------------------------------------- /images/white/person@3x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/person@3x.png -------------------------------------------------------------------------------- /images/white/person@4x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/person@4x.png -------------------------------------------------------------------------------- /images/white/settings@2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/settings@2x.png -------------------------------------------------------------------------------- /images/white/settings@3x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/settings@3x.png -------------------------------------------------------------------------------- /images/white/settings@4x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/settings@4x.png -------------------------------------------------------------------------------- /images/white/subway@2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/subway@2x.png -------------------------------------------------------------------------------- /images/white/subway@3x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/subway@3x.png -------------------------------------------------------------------------------- /images/white/subway@4x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/subway@4x.png -------------------------------------------------------------------------------- /images/white/x18/bus@2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/x18/bus@2x.png -------------------------------------------------------------------------------- /images/white/x18/bus@3x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/x18/bus@3x.png -------------------------------------------------------------------------------- /images/white/x18/bus@4x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/x18/bus@4x.png -------------------------------------------------------------------------------- /images/white/x18/car@2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/x18/car@2x.png -------------------------------------------------------------------------------- /images/white/x18/car@3x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/x18/car@3x.png -------------------------------------------------------------------------------- /images/white/x18/car@4x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/x18/car@4x.png -------------------------------------------------------------------------------- /images/white/x18/done@2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/x18/done@2x.png -------------------------------------------------------------------------------- /images/white/x18/done@3x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/x18/done@3x.png -------------------------------------------------------------------------------- /images/white/x18/done@4x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/x18/done@4x.png -------------------------------------------------------------------------------- /images/white/x18/flight.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/x18/flight.png -------------------------------------------------------------------------------- /images/white/x18/home@2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/x18/home@2x.png -------------------------------------------------------------------------------- /images/white/x18/home@3x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/x18/home@3x.png -------------------------------------------------------------------------------- /images/white/x18/home@4x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/x18/home@4x.png -------------------------------------------------------------------------------- /images/white/x18/person.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/x18/person.png -------------------------------------------------------------------------------- /images/white/x18/subway.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/x18/subway.png -------------------------------------------------------------------------------- /images/white/x18/truck.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/x18/truck.png -------------------------------------------------------------------------------- /images/white/x36/bus@2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/x36/bus@2x.png -------------------------------------------------------------------------------- /images/white/x36/bus@3x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/x36/bus@3x.png -------------------------------------------------------------------------------- /images/white/x36/bus@4x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/x36/bus@4x.png -------------------------------------------------------------------------------- /images/white/x36/car@2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/x36/car@2x.png -------------------------------------------------------------------------------- /images/white/x36/car@3x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/x36/car@3x.png -------------------------------------------------------------------------------- /images/white/x36/car@4x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/x36/car@4x.png -------------------------------------------------------------------------------- /images/white/x36/done@2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/x36/done@2x.png -------------------------------------------------------------------------------- /images/white/x36/done@3x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/x36/done@3x.png -------------------------------------------------------------------------------- /images/white/x36/done@4x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/x36/done@4x.png -------------------------------------------------------------------------------- /images/white/x36/flight.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/x36/flight.png -------------------------------------------------------------------------------- /images/white/x36/home@2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/x36/home@2x.png -------------------------------------------------------------------------------- /images/white/x36/home@3x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/x36/home@3x.png -------------------------------------------------------------------------------- /images/white/x36/home@4x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/x36/home@4x.png -------------------------------------------------------------------------------- /images/white/x36/person.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/x36/person.png -------------------------------------------------------------------------------- /images/white/x36/subway.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/x36/subway.png -------------------------------------------------------------------------------- /images/white/x36/truck.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/x36/truck.png -------------------------------------------------------------------------------- /images/white/x48/bus@2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/x48/bus@2x.png -------------------------------------------------------------------------------- /images/white/x48/bus@3x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/x48/bus@3x.png -------------------------------------------------------------------------------- /images/white/x48/bus@4x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/x48/bus@4x.png -------------------------------------------------------------------------------- /images/white/x48/car@2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/x48/car@2x.png -------------------------------------------------------------------------------- /images/white/x48/car@3x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/x48/car@3x.png -------------------------------------------------------------------------------- /images/white/x48/car@4x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/x48/car@4x.png -------------------------------------------------------------------------------- /images/white/x48/done@2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/x48/done@2x.png -------------------------------------------------------------------------------- /images/white/x48/done@3x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/x48/done@3x.png -------------------------------------------------------------------------------- /images/white/x48/done@4x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/x48/done@4x.png -------------------------------------------------------------------------------- /images/white/x48/flight.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/x48/flight.png -------------------------------------------------------------------------------- /images/white/x48/home@2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/x48/home@2x.png -------------------------------------------------------------------------------- /images/white/x48/home@3x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/x48/home@3x.png -------------------------------------------------------------------------------- /images/white/x48/home@4x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/x48/home@4x.png -------------------------------------------------------------------------------- /images/white/x48/person.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/x48/person.png -------------------------------------------------------------------------------- /images/white/x48/subway.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/x48/subway.png -------------------------------------------------------------------------------- /images/white/x48/truck.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/x48/truck.png -------------------------------------------------------------------------------- /images/black/arrow_back@2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/arrow_back@2x.png -------------------------------------------------------------------------------- /images/black/arrow_back@3x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/arrow_back@3x.png -------------------------------------------------------------------------------- /images/black/arrow_back@4x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/arrow_back@4x.png -------------------------------------------------------------------------------- /images/black/directions@2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/directions@2x.png -------------------------------------------------------------------------------- /images/black/directions@3x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/directions@3x.png -------------------------------------------------------------------------------- /images/black/directions@4x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/directions@4x.png -------------------------------------------------------------------------------- /images/black/more_vert@2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/more_vert@2x.png -------------------------------------------------------------------------------- /images/black/more_vert@3x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/more_vert@3x.png -------------------------------------------------------------------------------- /images/black/more_vert@4x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/more_vert@4x.png -------------------------------------------------------------------------------- /images/black/x18/flight@2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/x18/flight@2x.png -------------------------------------------------------------------------------- /images/black/x18/flight@3x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/x18/flight@3x.png -------------------------------------------------------------------------------- /images/black/x18/flight@4x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/x18/flight@4x.png -------------------------------------------------------------------------------- /images/black/x18/person@2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/x18/person@2x.png -------------------------------------------------------------------------------- /images/black/x18/person@3x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/x18/person@3x.png -------------------------------------------------------------------------------- /images/black/x18/person@4x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/x18/person@4x.png -------------------------------------------------------------------------------- /images/black/x18/settings.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/x18/settings.png -------------------------------------------------------------------------------- /images/black/x18/subway@2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/x18/subway@2x.png -------------------------------------------------------------------------------- /images/black/x18/subway@3x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/x18/subway@3x.png -------------------------------------------------------------------------------- /images/black/x18/subway@4x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/x18/subway@4x.png -------------------------------------------------------------------------------- /images/black/x18/truck@2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/x18/truck@2x.png -------------------------------------------------------------------------------- /images/black/x18/truck@3x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/x18/truck@3x.png -------------------------------------------------------------------------------- /images/black/x18/truck@4x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/x18/truck@4x.png -------------------------------------------------------------------------------- /images/black/x36/flight@2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/x36/flight@2x.png -------------------------------------------------------------------------------- /images/black/x36/flight@3x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/x36/flight@3x.png -------------------------------------------------------------------------------- /images/black/x36/flight@4x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/x36/flight@4x.png -------------------------------------------------------------------------------- /images/black/x36/person@2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/x36/person@2x.png -------------------------------------------------------------------------------- /images/black/x36/person@3x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/x36/person@3x.png -------------------------------------------------------------------------------- /images/black/x36/person@4x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/x36/person@4x.png -------------------------------------------------------------------------------- /images/black/x36/settings.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/x36/settings.png -------------------------------------------------------------------------------- /images/black/x36/subway@2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/x36/subway@2x.png -------------------------------------------------------------------------------- /images/black/x36/subway@3x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/x36/subway@3x.png -------------------------------------------------------------------------------- /images/black/x36/subway@4x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/x36/subway@4x.png -------------------------------------------------------------------------------- /images/black/x36/truck@2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/x36/truck@2x.png -------------------------------------------------------------------------------- /images/black/x36/truck@3x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/x36/truck@3x.png -------------------------------------------------------------------------------- /images/black/x36/truck@4x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/x36/truck@4x.png -------------------------------------------------------------------------------- /images/black/x48/flight@2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/x48/flight@2x.png -------------------------------------------------------------------------------- /images/black/x48/flight@3x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/x48/flight@3x.png -------------------------------------------------------------------------------- /images/black/x48/flight@4x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/x48/flight@4x.png -------------------------------------------------------------------------------- /images/black/x48/person@2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/x48/person@2x.png -------------------------------------------------------------------------------- /images/black/x48/person@3x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/x48/person@3x.png -------------------------------------------------------------------------------- /images/black/x48/person@4x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/x48/person@4x.png -------------------------------------------------------------------------------- /images/black/x48/settings.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/x48/settings.png -------------------------------------------------------------------------------- /images/black/x48/subway@2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/x48/subway@2x.png -------------------------------------------------------------------------------- /images/black/x48/subway@3x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/x48/subway@3x.png -------------------------------------------------------------------------------- /images/black/x48/subway@4x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/x48/subway@4x.png -------------------------------------------------------------------------------- /images/black/x48/truck@2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/x48/truck@2x.png -------------------------------------------------------------------------------- /images/black/x48/truck@3x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/x48/truck@3x.png -------------------------------------------------------------------------------- /images/black/x48/truck@4x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/x48/truck@4x.png -------------------------------------------------------------------------------- /images/white/arrow_back@2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/arrow_back@2x.png -------------------------------------------------------------------------------- /images/white/arrow_back@3x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/arrow_back@3x.png -------------------------------------------------------------------------------- /images/white/arrow_back@4x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/arrow_back@4x.png -------------------------------------------------------------------------------- /images/white/directions@2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/directions@2x.png -------------------------------------------------------------------------------- /images/white/directions@3x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/directions@3x.png -------------------------------------------------------------------------------- /images/white/directions@4x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/directions@4x.png -------------------------------------------------------------------------------- /images/white/more_vert@2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/more_vert@2x.png -------------------------------------------------------------------------------- /images/white/more_vert@3x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/more_vert@3x.png -------------------------------------------------------------------------------- /images/white/more_vert@4x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/more_vert@4x.png -------------------------------------------------------------------------------- /images/white/x18/flight@2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/x18/flight@2x.png -------------------------------------------------------------------------------- /images/white/x18/flight@3x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/x18/flight@3x.png -------------------------------------------------------------------------------- /images/white/x18/flight@4x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/x18/flight@4x.png -------------------------------------------------------------------------------- /images/white/x18/person@2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/x18/person@2x.png -------------------------------------------------------------------------------- /images/white/x18/person@3x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/x18/person@3x.png -------------------------------------------------------------------------------- /images/white/x18/person@4x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/x18/person@4x.png -------------------------------------------------------------------------------- /images/white/x18/settings.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/x18/settings.png -------------------------------------------------------------------------------- /images/white/x18/subway@2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/x18/subway@2x.png -------------------------------------------------------------------------------- /images/white/x18/subway@3x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/x18/subway@3x.png -------------------------------------------------------------------------------- /images/white/x18/subway@4x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/x18/subway@4x.png -------------------------------------------------------------------------------- /images/white/x18/truck@2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/x18/truck@2x.png -------------------------------------------------------------------------------- /images/white/x18/truck@3x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/x18/truck@3x.png -------------------------------------------------------------------------------- /images/white/x18/truck@4x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/x18/truck@4x.png -------------------------------------------------------------------------------- /images/white/x36/flight@2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/x36/flight@2x.png -------------------------------------------------------------------------------- /images/white/x36/flight@3x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/x36/flight@3x.png -------------------------------------------------------------------------------- /images/white/x36/flight@4x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/x36/flight@4x.png -------------------------------------------------------------------------------- /images/white/x36/person@2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/x36/person@2x.png -------------------------------------------------------------------------------- /images/white/x36/person@3x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/x36/person@3x.png -------------------------------------------------------------------------------- /images/white/x36/person@4x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/x36/person@4x.png -------------------------------------------------------------------------------- /images/white/x36/settings.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/x36/settings.png -------------------------------------------------------------------------------- /images/white/x36/subway@2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/x36/subway@2x.png -------------------------------------------------------------------------------- /images/white/x36/subway@3x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/x36/subway@3x.png -------------------------------------------------------------------------------- /images/white/x36/subway@4x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/x36/subway@4x.png -------------------------------------------------------------------------------- /images/white/x36/truck@2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/x36/truck@2x.png -------------------------------------------------------------------------------- /images/white/x36/truck@3x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/x36/truck@3x.png -------------------------------------------------------------------------------- /images/white/x36/truck@4x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/x36/truck@4x.png -------------------------------------------------------------------------------- /images/white/x48/flight@2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/x48/flight@2x.png -------------------------------------------------------------------------------- /images/white/x48/flight@3x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/x48/flight@3x.png -------------------------------------------------------------------------------- /images/white/x48/flight@4x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/x48/flight@4x.png -------------------------------------------------------------------------------- /images/white/x48/person@2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/x48/person@2x.png -------------------------------------------------------------------------------- /images/white/x48/person@3x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/x48/person@3x.png -------------------------------------------------------------------------------- /images/white/x48/person@4.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/x48/person@4.png -------------------------------------------------------------------------------- /images/white/x48/settings.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/x48/settings.png -------------------------------------------------------------------------------- /images/white/x48/subway@2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/x48/subway@2x.png -------------------------------------------------------------------------------- /images/white/x48/subway@3x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/x48/subway@3x.png -------------------------------------------------------------------------------- /images/white/x48/subway@4x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/x48/subway@4x.png -------------------------------------------------------------------------------- /images/white/x48/truck@2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/x48/truck@2x.png -------------------------------------------------------------------------------- /images/white/x48/truck@3x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/x48/truck@3x.png -------------------------------------------------------------------------------- /images/white/x48/truck@4x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/x48/truck@4x.png -------------------------------------------------------------------------------- /images/black/x18/arrow_back.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/x18/arrow_back.png -------------------------------------------------------------------------------- /images/black/x18/directions.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/x18/directions.png -------------------------------------------------------------------------------- /images/black/x18/settings@2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/x18/settings@2x.png -------------------------------------------------------------------------------- /images/black/x18/settings@3x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/x18/settings@3x.png -------------------------------------------------------------------------------- /images/black/x18/settings@4x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/x18/settings@4x.png -------------------------------------------------------------------------------- /images/black/x36/arrow_back.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/x36/arrow_back.png -------------------------------------------------------------------------------- /images/black/x36/directions.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/x36/directions.png -------------------------------------------------------------------------------- /images/black/x36/settings@2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/x36/settings@2x.png -------------------------------------------------------------------------------- /images/black/x36/settings@3x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/x36/settings@3x.png -------------------------------------------------------------------------------- /images/black/x36/settings@4x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/x36/settings@4x.png -------------------------------------------------------------------------------- /images/black/x48/arrow_back.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/x48/arrow_back.png -------------------------------------------------------------------------------- /images/black/x48/directions.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/x48/directions.png -------------------------------------------------------------------------------- /images/black/x48/directions@4.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/x48/directions@4.png -------------------------------------------------------------------------------- /images/black/x48/settings@2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/x48/settings@2x.png -------------------------------------------------------------------------------- /images/black/x48/settings@3x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/x48/settings@3x.png -------------------------------------------------------------------------------- /images/black/x48/settings@4x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/x48/settings@4x.png -------------------------------------------------------------------------------- /images/white/x18/arrow_back.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/x18/arrow_back.png -------------------------------------------------------------------------------- /images/white/x18/directions.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/x18/directions.png -------------------------------------------------------------------------------- /images/white/x18/settings@2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/x18/settings@2x.png -------------------------------------------------------------------------------- /images/white/x18/settings@3x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/x18/settings@3x.png -------------------------------------------------------------------------------- /images/white/x18/settings@4x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/x18/settings@4x.png -------------------------------------------------------------------------------- /images/white/x36/arrow_back.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/x36/arrow_back.png -------------------------------------------------------------------------------- /images/white/x36/directions.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/x36/directions.png -------------------------------------------------------------------------------- /images/white/x36/settings@2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/x36/settings@2x.png -------------------------------------------------------------------------------- /images/white/x36/settings@3x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/x36/settings@3x.png -------------------------------------------------------------------------------- /images/white/x36/settings@4x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/x36/settings@4x.png -------------------------------------------------------------------------------- /images/white/x48/arrow_back.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/x48/arrow_back.png -------------------------------------------------------------------------------- /images/white/x48/arrow_back@4.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/x48/arrow_back@4.png -------------------------------------------------------------------------------- /images/white/x48/directions.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/x48/directions.png -------------------------------------------------------------------------------- /images/white/x48/settings@2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/x48/settings@2x.png -------------------------------------------------------------------------------- /images/white/x48/settings@3x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/x48/settings@3x.png -------------------------------------------------------------------------------- /images/white/x48/settings@4x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/x48/settings@4x.png -------------------------------------------------------------------------------- /images/black/x18/arrow_back@2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/x18/arrow_back@2x.png -------------------------------------------------------------------------------- /images/black/x18/arrow_back@3x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/x18/arrow_back@3x.png -------------------------------------------------------------------------------- /images/black/x18/arrow_back@4x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/x18/arrow_back@4x.png -------------------------------------------------------------------------------- /images/black/x18/directions@2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/x18/directions@2x.png -------------------------------------------------------------------------------- /images/black/x18/directions@3x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/x18/directions@3x.png -------------------------------------------------------------------------------- /images/black/x18/directions@4x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/x18/directions@4x.png -------------------------------------------------------------------------------- /images/black/x36/arrow_back@2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/x36/arrow_back@2x.png -------------------------------------------------------------------------------- /images/black/x36/arrow_back@3x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/x36/arrow_back@3x.png -------------------------------------------------------------------------------- /images/black/x36/arrow_back@4x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/x36/arrow_back@4x.png -------------------------------------------------------------------------------- /images/black/x36/directions@2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/x36/directions@2x.png -------------------------------------------------------------------------------- /images/black/x36/directions@3x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/x36/directions@3x.png -------------------------------------------------------------------------------- /images/black/x36/directions@4x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/x36/directions@4x.png -------------------------------------------------------------------------------- /images/black/x48/arrow_back@2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/x48/arrow_back@2x.png -------------------------------------------------------------------------------- /images/black/x48/arrow_back@3x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/x48/arrow_back@3x.png -------------------------------------------------------------------------------- /images/black/x48/arrow_back@4x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/x48/arrow_back@4x.png -------------------------------------------------------------------------------- /images/black/x48/directions@2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/x48/directions@2x.png -------------------------------------------------------------------------------- /images/black/x48/directions@3x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/black/x48/directions@3x.png -------------------------------------------------------------------------------- /images/white/x18/arrow_back@2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/x18/arrow_back@2x.png -------------------------------------------------------------------------------- /images/white/x18/arrow_back@3x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/x18/arrow_back@3x.png -------------------------------------------------------------------------------- /images/white/x18/arrow_back@4x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/x18/arrow_back@4x.png -------------------------------------------------------------------------------- /images/white/x18/directions@2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/x18/directions@2x.png -------------------------------------------------------------------------------- /images/white/x18/directions@3x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/x18/directions@3x.png -------------------------------------------------------------------------------- /images/white/x18/directions@4x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/x18/directions@4x.png -------------------------------------------------------------------------------- /images/white/x36/arrow_back@2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/x36/arrow_back@2x.png -------------------------------------------------------------------------------- /images/white/x36/arrow_back@3x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/x36/arrow_back@3x.png -------------------------------------------------------------------------------- /images/white/x36/arrow_back@4x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/x36/arrow_back@4x.png -------------------------------------------------------------------------------- /images/white/x36/directions@2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/x36/directions@2x.png -------------------------------------------------------------------------------- /images/white/x36/directions@3x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/x36/directions@3x.png -------------------------------------------------------------------------------- /images/white/x36/directions@4x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/x36/directions@4x.png -------------------------------------------------------------------------------- /images/white/x48/arrow_back@2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/x48/arrow_back@2x.png -------------------------------------------------------------------------------- /images/white/x48/arrow_back@3x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/x48/arrow_back@3x.png -------------------------------------------------------------------------------- /images/white/x48/directions@2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/x48/directions@2x.png -------------------------------------------------------------------------------- /images/white/x48/directions@3x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/x48/directions@3x.png -------------------------------------------------------------------------------- /images/white/x48/directions@4x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ekke/tab_pages_x/HEAD/images/white/x48/directions@4x.png -------------------------------------------------------------------------------- /common/LabelBody.qml: -------------------------------------------------------------------------------- 1 | // ekke (Ekkehard Gentz) @ekkescorner 2 | import QtQuick 2.9 3 | import QtQuick.Layouts 1.3 4 | import QtQuick.Controls 2.2 5 | 6 | Label { 7 | Layout.fillWidth: true 8 | opacity: opacityBodyAndButton 9 | } 10 | -------------------------------------------------------------------------------- /translations.qrc: -------------------------------------------------------------------------------- 1 | 2 | 3 | translations/tab_pages_x_de.qm 4 | translations/tab_pages_x_en.qm 5 | translations/tab_pages_x.qm 6 | 7 | 8 | -------------------------------------------------------------------------------- /common/LabelBodySecondary.qml: -------------------------------------------------------------------------------- 1 | // ekke (Ekkehard Gentz) @ekkescorner 2 | import QtQuick 2.9 3 | import QtQuick.Layouts 1.3 4 | import QtQuick.Controls 2.2 5 | 6 | Label { 7 | Layout.fillWidth: true 8 | opacity: opacityBodySecondary 9 | } 10 | -------------------------------------------------------------------------------- /common/LabelTitle.qml: -------------------------------------------------------------------------------- 1 | // ekke (Ekkehard Gentz) @ekkescorner 2 | import QtQuick 2.9 3 | import QtQuick.Layouts 1.3 4 | import QtQuick.Controls 2.2 5 | 6 | Label { 7 | Layout.fillWidth: true 8 | font.pixelSize: fontSizeTitle 9 | opacity: opacityTitle 10 | } 11 | -------------------------------------------------------------------------------- /common/LabelDisplay4.qml: -------------------------------------------------------------------------------- 1 | // ekke (Ekkehard Gentz) @ekkescornerimport QtQuick 2.9 2 | import QtQuick.Layouts 1.3 3 | import QtQuick.Controls 2.2 4 | 5 | Label { 6 | Layout.fillWidth: true 7 | font.pixelSize: fontSizeDisplay4 8 | opacity: opacityDisplay4 9 | } 10 | -------------------------------------------------------------------------------- /common/LabelDisplay1.qml: -------------------------------------------------------------------------------- 1 | // ekke (Ekkehard Gentz) @ekkescorner 2 | import QtQuick 2.9 3 | import QtQuick.Layouts 1.3 4 | import QtQuick.Controls 2.2 5 | 6 | Label { 7 | Layout.fillWidth: true 8 | font.pixelSize: fontSizeDisplay1 9 | opacity: opacityDisplay1 10 | } 11 | -------------------------------------------------------------------------------- /common/LabelDisplay2.qml: -------------------------------------------------------------------------------- 1 | // ekke (Ekkehard Gentz) @ekkescorner 2 | import QtQuick 2.9 3 | import QtQuick.Layouts 1.3 4 | import QtQuick.Controls 2.2 5 | 6 | Label { 7 | Layout.fillWidth: true 8 | font.pixelSize: fontSizeDisplay2 9 | opacity: opacityDisplay2 10 | } 11 | -------------------------------------------------------------------------------- /common/LabelDisplay3.qml: -------------------------------------------------------------------------------- 1 | // ekke (Ekkehard Gentz) @ekkescorner 2 | import QtQuick 2.9 3 | import QtQuick.Layouts 1.3 4 | import QtQuick.Controls 2.2 5 | 6 | Label { 7 | Layout.fillWidth: true 8 | font.pixelSize: fontSizeDisplay3 9 | opacity: opacityDisplay3 10 | } 11 | -------------------------------------------------------------------------------- /common/LabelHeadline.qml: -------------------------------------------------------------------------------- 1 | // ekke (Ekkehard Gentz) @ekkescorner 2 | import QtQuick 2.9 3 | import QtQuick.Layouts 1.3 4 | import QtQuick.Controls 2.2 5 | 6 | Label { 7 | Layout.fillWidth: true 8 | font.pixelSize: fontSizeHeadline 9 | opacity: opacityHeadline 10 | } 11 | -------------------------------------------------------------------------------- /common/LabelSubheading.qml: -------------------------------------------------------------------------------- 1 | // ekke (Ekkehard Gentz) @ekkescorner 2 | import QtQuick 2.9 3 | import QtQuick.Layouts 1.3 4 | import QtQuick.Controls 2.2 5 | 6 | Label { 7 | Layout.fillWidth: true 8 | font.pixelSize: fontSizeSubheading 9 | opacity: opacitySubheading 10 | } 11 | -------------------------------------------------------------------------------- /deployment.pri: -------------------------------------------------------------------------------- 1 | unix:!android { 2 | isEmpty(target.path) { 3 | qnx { 4 | target.path = /tmp/$${TARGET}/bin 5 | } else { 6 | target.path = /opt/$${TARGET}/bin 7 | } 8 | export(target.path) 9 | } 10 | INSTALLS += target 11 | } 12 | 13 | export(INSTALLS) 14 | -------------------------------------------------------------------------------- /common/LabelCaption.qml: -------------------------------------------------------------------------------- 1 | // ekke (Ekkehard Gentz) @ekkescorner 2 | import QtQuick 2.9 3 | import QtQuick.Layouts 1.3 4 | import QtQuick.Controls 2.2 5 | 6 | Label { 7 | Layout.fillWidth: true 8 | font.pixelSize: fontSizeCaption 9 | opacity: opacityCaption 10 | font.capitalization: Font.AllUppercase 11 | } 12 | 13 | 14 | 15 | -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | # C++ objects and libs 2 | 3 | *.slo 4 | *.lo 5 | *.o 6 | *.a 7 | *.la 8 | *.lai 9 | *.so 10 | *.dll 11 | *.dylib 12 | 13 | # Qt-es 14 | 15 | /.qmake.cache 16 | /.qmake.stash 17 | *.pro.user 18 | *.pro.user.* 19 | *.qbs.user 20 | *.qbs.user.* 21 | *.moc 22 | moc_*.cpp 23 | qrc_*.cpp 24 | ui_*.h 25 | Makefile* 26 | *build-* 27 | 28 | # QtCreator 29 | 30 | *.autosave 31 | 32 | #QtCtreator Qml 33 | *.qmlproject.user 34 | *.qmlproject.user.* 35 | 36 | *.qm 37 | -------------------------------------------------------------------------------- /AUTHOR.md: -------------------------------------------------------------------------------- 1 | # swiped_pages_x APP for Qt 5.7 2 | If not otherwise mentioned inside source files (*.cpp, *.hpp, *.qml): 3 | 4 | ##Author: 5 | ekke (Ekkehard Gentz) 6 | 7 | Max-Josefs-Platz 30 8 | 9 | 83022 Rosenheim 10 | 11 | Germany 12 | 13 | Twitter: @ekkescorner 14 | 15 | LinkedIn: https://de.linkedin.com/in/ekkehard 16 | 17 | ###blogs 18 | http://ekkes-corner.org 19 | 20 | http://appbus.org 21 | 22 | http://j.mp/qt-x 23 | 24 | (c) 2016 ekke (ekkehard gentz) 25 | -------------------------------------------------------------------------------- /common/HorizontalDivider.qml: -------------------------------------------------------------------------------- 1 | // ekke (Ekkehard Gentz) @ekkescorner 2 | import QtQuick 2.9 3 | import QtQuick.Controls 2.2 4 | import QtQuick.Controls.Material 2.2 5 | 6 | Item { 7 | height: 8 8 | anchors.left: parent.left 9 | anchors.right: parent.right 10 | anchors.margins: 6 11 | // https://www.google.com/design/spec/components/dividers.html#dividers-types-of-dividers 12 | Rectangle { 13 | width: parent.width 14 | height: 1 15 | opacity: dividerOpacity 16 | color: dividerColor 17 | } 18 | } 19 | -------------------------------------------------------------------------------- /common/SwitchWithLeftLabel.qml: -------------------------------------------------------------------------------- 1 | // ekke (Ekkehard Gentz) @ekkescorner 2 | import QtQuick 2.9 3 | import QtQuick.Controls 2.2 4 | 5 | Row { 6 | property alias text: switchLabel.text 7 | property alias checked: theSwitch.checked 8 | leftPadding: 6 9 | LabelBody { 10 | id: switchLabel 11 | wrapMode: Text.WordWrap 12 | anchors.verticalCenter: parent.verticalCenter 13 | } 14 | Switch { 15 | id: theSwitch 16 | focusPolicy: Qt.NoFocus 17 | anchors.verticalCenter: parent.verticalCenter 18 | } 19 | } 20 | -------------------------------------------------------------------------------- /common/VerticalDivider.qml: -------------------------------------------------------------------------------- 1 | // ekke (Ekkehard Gentz) @ekkescorner 2 | import QtQuick 2.9 3 | import QtQuick.Controls 2.2 4 | import QtQuick.Controls.Material 2.2 5 | Item { 6 | implicitWidth: 8 7 | anchors.top: parent.top 8 | anchors.bottom: parent.bottom 9 | // https://www.google.com/design/spec/components/dividers.html#dividers-types-of-dividers 10 | Rectangle { 11 | id: theRectangle 12 | width: 1 13 | height: parent.height 14 | anchors.horizontalCenter: parent.horizontalCenter 15 | opacity: dividerOpacity 16 | color: dividerColor 17 | } 18 | } 19 | -------------------------------------------------------------------------------- /common/ButtonIconActive.qml: -------------------------------------------------------------------------------- 1 | // ekke (Ekkehard Gentz) @ekkescorner 2 | import QtQuick 2.9 3 | import QtQuick.Layouts 1.3 4 | import QtQuick.Controls 2.2 5 | import QtQuick.Controls.Material 2.2 6 | import QtGraphicalEffects 1.0 7 | 8 | Button { 9 | id: button 10 | // default Image Size 24x24 11 | property alias imageName: theIcon.imageName 12 | property alias imageSize: theIcon.imageSize 13 | focusPolicy: Qt.NoFocus 14 | contentItem: 15 | IconActive { 16 | id: theIcon 17 | } 18 | background: 19 | Rectangle { 20 | id: buttonBackground 21 | implicitHeight: imageSize + 24 22 | implicitWidth: imageSize + 24 23 | color: button.pressed ? accentColor : "transparent" 24 | opacity: button.pressed ? 0.12 : 1.0 25 | } // background 26 | } 27 | -------------------------------------------------------------------------------- /applicationui.hpp: -------------------------------------------------------------------------------- 1 | // ekke (Ekkehard Gentz) @ekkescorner 2 | #ifndef APPLICATIONUI_HPP 3 | #define APPLICATIONUI_HPP 4 | 5 | #include 6 | 7 | class ApplicationUI : public QObject 8 | { 9 | Q_OBJECT 10 | 11 | public: 12 | ApplicationUI(QObject *parent = 0); 13 | 14 | Q_INVOKABLE 15 | QStringList swapThemePalette(); 16 | 17 | Q_INVOKABLE 18 | QStringList defaultThemePalette(); 19 | 20 | Q_INVOKABLE 21 | QStringList primaryPalette(const int paletteIndex); 22 | 23 | Q_INVOKABLE 24 | QStringList accentPalette(const int paletteIndex); 25 | 26 | Q_INVOKABLE 27 | QStringList defaultPrimaryPalette(); 28 | 29 | Q_INVOKABLE 30 | QStringList defaultAccentPalette(); 31 | 32 | signals: 33 | 34 | public slots: 35 | 36 | private: 37 | bool mIsDarkTheme; 38 | int mPrimaryPalette; 39 | int mAccentPalette; 40 | }; 41 | 42 | #endif // APPLICATIONUI_HPP 43 | -------------------------------------------------------------------------------- /tabs/TitleAndIconTabBar.qml: -------------------------------------------------------------------------------- 1 | // ekke (Ekkehard Gentz) @ekkescorner 2 | import QtQuick 2.9 3 | import QtQuick.Layouts 1.3 4 | import QtQuick.Controls 2.2 5 | import QtQuick.Controls.Material 2.2 6 | import QtGraphicalEffects 1.0 7 | import "../common" 8 | 9 | ColumnLayout { 10 | property alias text: myTitleBar.text 11 | property alias currentIndex: myTabBar.currentIndex 12 | spacing: 6 13 | SwipeTextTitle { 14 | id: myTitleBar 15 | backToolButtonVisible: false 16 | Layout.fillWidth: true 17 | } 18 | TabBar { 19 | id: myTabBar 20 | anchors.left: parent.left 21 | anchors.right: parent.right 22 | currentIndex: 0 23 | onCurrentIndexChanged: { 24 | navPane.currentIndex = currentIndex 25 | } 26 | Repeater { 27 | model: tabButtonModel 28 | TabButtonIcon { 29 | // text: modelData.name 30 | width: tabBarIsFixed? myTabBar.width / tabButtonModel.length : Math.max(112, myTabBar.width / tabButtonModel.length) 31 | } 32 | } // repeater 33 | 34 | } 35 | } 36 | -------------------------------------------------------------------------------- /main.cpp: -------------------------------------------------------------------------------- 1 | // ekke (Ekkehard Gentz) @ekkescorner 2 | #include 3 | #include 4 | #include 5 | #include 6 | #include 7 | 8 | #include "applicationui.hpp" 9 | 10 | int main(int argc, char *argv[]) 11 | { 12 | QGuiApplication::setAttribute(Qt::AA_EnableHighDpiScaling); 13 | qputenv("QT_QUICK_CONTROLS_STYLE", "material"); 14 | QGuiApplication app(argc, argv); 15 | 16 | QTranslator translator; 17 | if (translator.load(QLocale(), QLatin1String("tab_pages_x"), QLatin1String("_"), QLatin1String(":/translations"))) { 18 | app.installTranslator(&translator); 19 | } else { 20 | qDebug() << "cannot load translator " << QLocale::system().name() << " check content of translations.qrc"; 21 | } 22 | 23 | ApplicationUI appui; 24 | QQmlApplicationEngine engine; 25 | 26 | // from QML we have access to ApplicationUI as myApp 27 | QQmlContext* context = engine.rootContext(); 28 | context->setContextProperty("myApp", &appui); 29 | 30 | engine.load(QUrl(QStringLiteral("qrc:/main.qml"))); 31 | return app.exec(); 32 | } 33 | -------------------------------------------------------------------------------- /tabs/TitleAndTabBar.qml: -------------------------------------------------------------------------------- 1 | // ekke (Ekkehard Gentz) @ekkescorner 2 | import QtQuick 2.9 3 | import QtQuick.Layouts 1.3 4 | import QtQuick.Controls 2.2 5 | import QtQuick.Controls.Material 2.2 6 | import QtGraphicalEffects 1.0 7 | import "../common" 8 | 9 | ColumnLayout { 10 | property alias text: myTitleBar.text 11 | property alias currentIndex: myTabBar.currentIndex 12 | spacing: 6 13 | SwipeTextTitle { 14 | id: myTitleBar 15 | backToolButtonVisible: false 16 | Layout.fillWidth: true 17 | } 18 | TabBar { 19 | id: myTabBar 20 | anchors.left: parent.left 21 | anchors.right: parent.right 22 | currentIndex: 0 23 | onCurrentIndexChanged: { 24 | navPane.currentIndex = currentIndex 25 | } 26 | Repeater { 27 | model: tabButtonModel 28 | TabButton { 29 | focusPolicy: Qt.NoFocus 30 | text: modelData.name 31 | width: tabBarIsFixed? myTabBar.width / tabButtonModel.length : Math.max(112, myTabBar.width / tabButtonModel.length) 32 | } 33 | } // repeater 34 | 35 | } 36 | } 37 | -------------------------------------------------------------------------------- /common/IconActive.qml: -------------------------------------------------------------------------------- 1 | // ekke (Ekkehard Gentz) @ekkescorner 2 | import QtQuick 2.9 3 | 4 | Image { 5 | property string imageName: "" 6 | onImageNameChanged: { 7 | calculatePath() 8 | } 9 | property int imageSize: 0 10 | onImageSizeChanged: { 11 | if(imageName.length > 0) { 12 | calculatePath() 13 | } 14 | } 15 | //trick: to be triggered if folder changed 16 | property string currentIconFolder: iconFolder 17 | onCurrentIconFolderChanged: { 18 | if(imageName.length > 0) { 19 | calculatePath() 20 | } 21 | } 22 | opacity: iconActiveOpacity 23 | function calculatePath() { 24 | var path = "qrc:/images/"+currentIconFolder 25 | switch(imageSize) { 26 | case 18: 27 | path += "/x18/" 28 | break; 29 | case 36: 30 | path += "/x36/" 31 | break; 32 | case 48: 33 | path += "/x48/" 34 | break; 35 | default: 36 | path += "/" 37 | } // switch 38 | path += imageName 39 | source = path 40 | } 41 | } 42 | -------------------------------------------------------------------------------- /common/IconInactive.qml: -------------------------------------------------------------------------------- 1 | // ekke (Ekkehard Gentz) @ekkescorner 2 | import QtQuick 2.9 3 | 4 | Image { 5 | property string imageName: "" 6 | onImageNameChanged: { 7 | calculatePath() 8 | } 9 | property int imageSize: 0 10 | onImageSizeChanged: { 11 | if(imageName.length > 0) { 12 | calculatePath() 13 | } 14 | } 15 | //trick: to be triggered if folder changed 16 | property string currentIconFolder: iconFolder 17 | onCurrentIconFolderChanged: { 18 | if(imageName.length > 0) { 19 | calculatePath() 20 | } 21 | } 22 | opacity: iconInactiveOpacity 23 | function calculatePath() { 24 | var path = "qrc:/images/"+currentIconFolder 25 | switch(imageSize) { 26 | case 18: 27 | path += "/x18/" 28 | break; 29 | case 36: 30 | path += "/x36/" 31 | break; 32 | case 48: 33 | path += "/x48/" 34 | break; 35 | default: 36 | path += "/" 37 | } // switch 38 | path += imageName 39 | source = path 40 | } 41 | } 42 | -------------------------------------------------------------------------------- /tabs/TabButtonIcon.qml: -------------------------------------------------------------------------------- 1 | // ekke (Ekkehard Gentz) @ekkescorner 2 | import QtQuick 2.9 3 | import QtQuick.Layouts 1.3 4 | import QtQuick.Controls 2.2 5 | import QtQuick.Controls.Material 2.2 6 | import QtGraphicalEffects 1.0 7 | 8 | TabButton { 9 | property color theButtonColor: accentColor 10 | property string theIconFolder: iconFolder 11 | property alias hasOverlay: colorOverlay.visible 12 | property real theOpacity: 1.0 13 | focusPolicy: Qt.NoFocus 14 | height: 48 15 | contentItem: 16 | Item { 17 | Image { 18 | id: contentImage 19 | anchors.centerIn: parent 20 | horizontalAlignment: Image.AlignHCenter 21 | verticalAlignment: Image.AlignVCenter 22 | source: "qrc:/images/"+theIconFolder+"/"+modelData.icon 23 | opacity: colorOverlay.visible? 1.0 : theOpacity 24 | } 25 | ColorOverlay { 26 | id: colorOverlay 27 | visible: true 28 | anchors.fill: contentImage 29 | source: contentImage 30 | color: index == navPane.currentIndex ? theButtonColor : Qt.lighter(theButtonColor, 1.35) 31 | } 32 | } // item 33 | } 34 | -------------------------------------------------------------------------------- /common/ButtonFlat.qml: -------------------------------------------------------------------------------- 1 | // ekke (Ekkehard Gentz) @ekkescorner 2 | import QtQuick 2.9 3 | import QtQuick.Layouts 1.3 4 | import QtQuick.Controls 2.2 5 | import QtQuick.Controls.Material 2.2 6 | import QtGraphicalEffects 1.0 7 | 8 | // Flat Button 9 | Button { 10 | id: button 11 | // default: flatButtonTextColor 12 | property alias textColor: buttonText.color 13 | focusPolicy: Qt.NoFocus 14 | Layout.fillWidth: true 15 | Layout.preferredWidth : 1 16 | leftPadding: 6 17 | rightPadding: 6 18 | contentItem: Text { 19 | id: buttonText 20 | text: button.text 21 | opacity: enabled ? 1.0 : 0.3 22 | color: flatButtonTextColor 23 | horizontalAlignment: Text.AlignHCenter 24 | verticalAlignment: Text.AlignVCenter 25 | elide: Text.ElideRight 26 | font.capitalization: Font.AllUppercase 27 | font.weight: Font.Medium 28 | } 29 | background: 30 | Rectangle { 31 | id: buttonBackground 32 | implicitHeight: 48 33 | Layout.minimumWidth: 88 34 | color: button.pressed ? buttonText.color : "transparent" 35 | radius: 2 36 | opacity: button.pressed ? 0.12 : 1.0 37 | } // background 38 | } // button 39 | -------------------------------------------------------------------------------- /common/FloatingActionMiniButton.qml: -------------------------------------------------------------------------------- 1 | // ekke (Ekkehard Gentz) @ekkescorner 2 | import QtQuick 2.9 3 | import QtQuick.Controls 2.2 4 | import QtQuick.Controls.Material 2.2 5 | import QtGraphicalEffects 1.0 6 | 7 | Button { 8 | id: button 9 | // image should be 24x24 10 | property alias imageSource: contentImage.source 11 | // default: primaryColor 12 | property alias backgroundColor: buttonBackground.color 13 | property bool showShadow: false 14 | focusPolicy: Qt.NoFocus 15 | contentItem: 16 | Item { 17 | implicitHeight: 24 18 | implicitWidth: 24 19 | Image { 20 | id: contentImage 21 | anchors.centerIn: parent 22 | } 23 | } 24 | background: 25 | Rectangle { 26 | id: buttonBackground 27 | implicitWidth: 48 28 | implicitHeight: 48 29 | color: primaryColor 30 | radius: width / 2 31 | opacity: button.pressed ? 0.75 : 1.0 32 | layer.enabled: button.showShadow 33 | layer.effect: DropShadow { 34 | verticalOffset: 3 35 | horizontalOffset: 1 36 | color: dropShadow 37 | samples: button.pressed ? 20 : 10 38 | spread: 0.5 39 | } 40 | } 41 | } 42 | -------------------------------------------------------------------------------- /LICENSE: -------------------------------------------------------------------------------- 1 | This is free and unencumbered software released into the public domain. 2 | 3 | Anyone is free to copy, modify, publish, use, compile, sell, or 4 | distribute this software, either in source code form or as a compiled 5 | binary, for any purpose, commercial or non-commercial, and by any 6 | means. 7 | 8 | In jurisdictions that recognize copyright laws, the author or authors 9 | of this software dedicate any and all copyright interest in the 10 | software to the public domain. We make this dedication for the benefit 11 | of the public at large and to the detriment of our heirs and 12 | successors. We intend this dedication to be an overt act of 13 | relinquishment in perpetuity of all present and future rights to this 14 | software under copyright law. 15 | 16 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, 17 | EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF 18 | MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. 19 | IN NO EVENT SHALL THE AUTHORS BE LIABLE FOR ANY CLAIM, DAMAGES OR 20 | OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, 21 | ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR 22 | OTHER DEALINGS IN THE SOFTWARE. 23 | 24 | For more information, please refer to 25 | -------------------------------------------------------------------------------- /common/FloatingActionButton.qml: -------------------------------------------------------------------------------- 1 | // ekke (Ekkehard Gentz) @ekkescorner 2 | import QtQuick 2.9 3 | import QtQuick.Layouts 1.3 4 | import QtQuick.Controls 2.2 5 | import QtQuick.Controls.Material 2.2 6 | import QtGraphicalEffects 1.0 7 | 8 | Button { 9 | id: button 10 | // image should be 24x24 11 | property alias imageSource: contentImage.source 12 | // default: primaryColor 13 | property alias backgroundColor: buttonBackground.color 14 | property bool showShadow: true 15 | focusPolicy: Qt.NoFocus 16 | contentItem: 17 | Item { 18 | implicitHeight: 24 19 | implicitWidth: 24 20 | Image { 21 | id: contentImage 22 | anchors.centerIn: parent 23 | } 24 | } 25 | background: 26 | Rectangle { 27 | id: buttonBackground 28 | implicitWidth: 56 29 | implicitHeight: 56 30 | color: primaryColor 31 | radius: width / 2 32 | opacity: button.pressed ? 0.75 : 1.0 33 | layer.enabled: button.showShadow 34 | layer.effect: DropShadow { 35 | verticalOffset: 3 36 | horizontalOffset: 1 37 | color: dropShadow 38 | samples: button.pressed ? 20 : 10 39 | spread: 0.5 40 | } 41 | } 42 | } 43 | -------------------------------------------------------------------------------- /tabs/TitleAndIconTextTabBar.qml: -------------------------------------------------------------------------------- 1 | // ekke (Ekkehard Gentz) @ekkescorner 2 | import QtQuick 2.9 3 | import QtQuick.Layouts 1.3 4 | import QtQuick.Controls 2.2 5 | import QtQuick.Controls.Material 2.2 6 | import QtGraphicalEffects 1.0 7 | import "../common" 8 | 9 | ColumnLayout { 10 | property alias text: myTitleBar.text 11 | property alias currentIndex: myTabBar.currentIndex 12 | spacing: 6 13 | SwipeTextTitle { 14 | id: myTitleBar 15 | backToolButtonVisible: false 16 | Layout.fillWidth: true 17 | } 18 | TabBar { 19 | id: myTabBar 20 | anchors.left: parent.left 21 | anchors.right: parent.right 22 | bottomPadding: isLandscape? 24 : 16 23 | height: 72 24 | currentIndex: 0 25 | onCurrentIndexChanged: { 26 | navPane.currentIndex = currentIndex 27 | } 28 | Repeater { 29 | model: tabButtonModel 30 | TabButtonTextAndIcon { 31 | // text: modelData.name 32 | theOpacity: index == navPane.currentIndex ? toolBarActiveOpacity : toolBarInactiveOpacity 33 | width: tabBarIsFixed? myTabBar.width / tabButtonModel.length : Math.max(112, myTabBar.width / tabButtonModel.length) 34 | } 35 | } // repeater 36 | 37 | } 38 | } 39 | -------------------------------------------------------------------------------- /common/IconColored.qml: -------------------------------------------------------------------------------- 1 | // ekke (Ekkehard Gentz) @ekkescorner 2 | import QtQuick 2.9 3 | import QtGraphicalEffects 1.0 4 | 5 | Image { 6 | id: image 7 | property string imageName: "" 8 | onImageNameChanged: { 9 | calculatePath() 10 | } 11 | property int imageSize: 0 12 | onImageSizeChanged: { 13 | if(imageName.length > 0) { 14 | calculatePath() 15 | } 16 | } 17 | // default: primary color 18 | property alias color: colorOverlay.color 19 | //trick: to be triggered if folder changed 20 | property string currentIconFolder: iconFolder 21 | onCurrentIconFolderChanged: { 22 | if(imageName.length > 0) { 23 | calculatePath() 24 | } 25 | } 26 | ColorOverlay { 27 | id: colorOverlay 28 | anchors.fill: image 29 | source: image 30 | color: primaryColor 31 | } 32 | function calculatePath() { 33 | var path = "qrc:/images/"+currentIconFolder 34 | switch(imageSize) { 35 | case 18: 36 | path += "/x18/" 37 | break; 38 | case 36: 39 | path += "/x36/" 40 | break; 41 | case 48: 42 | path += "/x48/" 43 | break; 44 | default: 45 | path += "/" 46 | } // switch 47 | path += imageName 48 | source = path 49 | } 50 | } 51 | -------------------------------------------------------------------------------- /common/ButtonRaised.qml: -------------------------------------------------------------------------------- 1 | // ekke (Ekkehard Gentz) @ekkescorner 2 | import QtQuick 2.9 3 | import QtQuick.Layouts 1.3 4 | import QtQuick.Controls 2.2 5 | import QtQuick.Controls.Material 2.2 6 | import QtGraphicalEffects 1.0 7 | 8 | // Raised Button 9 | Button { 10 | id: button 11 | // default: textOnPrimary 12 | property alias textColor: buttonText.color 13 | // default: primaryColor 14 | property alias buttonColor: buttonBackground.color 15 | focusPolicy: Qt.NoFocus 16 | Layout.fillWidth: true 17 | Layout.preferredWidth : 1 18 | leftPadding: 6 19 | rightPadding: 6 20 | contentItem: Text { 21 | id: buttonText 22 | text: button.text 23 | opacity: enabled ? 1.0 : 0.3 24 | color: textOnPrimary 25 | horizontalAlignment: Text.AlignHCenter 26 | verticalAlignment: Text.AlignVCenter 27 | elide: Text.ElideRight 28 | font.capitalization: Font.AllUppercase 29 | } 30 | background: 31 | Rectangle { 32 | id: buttonBackground 33 | implicitHeight: 48 34 | color: primaryColor 35 | radius: 2 36 | opacity: button.pressed ? 0.75 : 1.0 37 | layer.enabled: true 38 | layer.effect: DropShadow { 39 | verticalOffset: 2 40 | horizontalOffset: 1 41 | color: dropShadow 42 | samples: button.pressed ? 20 : 10 43 | spread: 0.5 44 | } 45 | } // background 46 | } // button 47 | -------------------------------------------------------------------------------- /popups/PopupInfo.qml: -------------------------------------------------------------------------------- 1 | import QtQuick 2.9 2 | import QtQuick.Layouts 1.3 3 | import QtQuick.Controls 2.2 4 | import "../common" 5 | 6 | Popup { 7 | id: popup 8 | property alias text: popupLabel.text 9 | property alias buttonText: okButton.text 10 | x: (parent.width - width) / 2 11 | y: (parent.height - height) / 2 12 | implicitHeight: 160 13 | implicitWidth: parent.width * .9 14 | ColumnLayout { 15 | anchors.right: parent.right 16 | anchors.left: parent.left 17 | spacing: 10 18 | RowLayout { 19 | LabelSubheading { 20 | id: popupLabel 21 | topPadding: 20 22 | leftPadding: 8 23 | rightPadding: 8 24 | text: "" 25 | color: popupTextColor 26 | horizontalAlignment: Text.AlignHCenter 27 | } // popupLabel 28 | } // row label 29 | RowLayout { 30 | ButtonFlat { 31 | id: okButton 32 | text: "" 33 | textColor: accentColor 34 | onClicked: { 35 | popup.close() 36 | } 37 | } // okButton 38 | } // row button 39 | } // col layout 40 | 41 | onAboutToHide: { 42 | stopTimer() 43 | } 44 | onAboutToShow: { 45 | closeTimer.start() 46 | } 47 | 48 | Timer { 49 | id: closeTimer 50 | interval: 3000 51 | repeat: false 52 | onTriggered: { 53 | popup.close() 54 | } 55 | } 56 | function stopTimer() { 57 | closeTimer.stop() 58 | } 59 | } // popup 60 | -------------------------------------------------------------------------------- /tabs/TabButtonTextAndIcon.qml: -------------------------------------------------------------------------------- 1 | // ekke (Ekkehard Gentz) @ekkescorner 2 | import QtQuick 2.9 3 | import QtQuick.Layouts 1.3 4 | import QtQuick.Controls 2.2 5 | import QtQuick.Controls.Material 2.2 6 | import QtGraphicalEffects 1.0 7 | import "../common" 8 | 9 | TabButton { 10 | property color theButtonColor: accentColor 11 | property string theIconFolder: iconFolder 12 | property alias hasOverlay: colorOverlay.visible 13 | property real theOpacity: 1.0 14 | focusPolicy: Qt.NoFocus 15 | height: 72 16 | contentItem: 17 | Item { 18 | Image { 19 | id: contentImage 20 | // anchors.centerIn: parent 21 | anchors.top: parent.top 22 | anchors.horizontalCenter: parent.horizontalCenter 23 | // y: 12 24 | horizontalAlignment: Image.AlignHCenter 25 | source: "qrc:/images/"+theIconFolder+"/"+modelData.icon 26 | opacity: colorOverlay.visible? 1.0 : theOpacity 27 | } 28 | ColorOverlay { 29 | id: colorOverlay 30 | visible: true 31 | anchors.fill: contentImage 32 | source: contentImage 33 | color: index == navPane.currentIndex ? theButtonColor : Qt.lighter(theButtonColor, 1.35) 34 | 35 | } 36 | LabelBody { 37 | id: myLabel 38 | topPadding: 6 39 | anchors.top: contentImage.bottom 40 | anchors.left: parent.left 41 | anchors.right: parent.right 42 | horizontalAlignment: Text.AlignHCenter 43 | font.capitalization: Font.AllUppercase 44 | font.weight: Font.Medium 45 | color: theButtonColor 46 | opacity: theOpacity 47 | text: modelData.name 48 | } 49 | } // content item 50 | 51 | 52 | 53 | } 54 | -------------------------------------------------------------------------------- /qml.qrc: -------------------------------------------------------------------------------- 1 | 2 | 3 | main.qml 4 | common/VerticalDivider.qml 5 | common/HorizontalDivider.qml 6 | common/SwitchWithLeftLabel.qml 7 | common/SimpleTextTitle.qml 8 | popups/PopupPalette.qml 9 | common/LabelCaption.qml 10 | common/LabelBody.qml 11 | common/LabelBodySecondary.qml 12 | common/LabelSubheading.qml 13 | common/LabelTitle.qml 14 | common/LabelHeadline.qml 15 | common/LabelDisplay1.qml 16 | common/LabelDisplay2.qml 17 | common/LabelDisplay3.qml 18 | common/LabelDisplay4.qml 19 | common/FloatingActionButton.qml 20 | common/FloatingActionMiniButton.qml 21 | common/IconActive.qml 22 | common/IconInactive.qml 23 | common/IconColored.qml 24 | pages/PageOne.qml 25 | pages/PageTwo.qml 26 | pages/PageFour.qml 27 | pages/PageThree.qml 28 | pages/PageFive.qml 29 | common/ButtonRaised.qml 30 | common/ButtonFlat.qml 31 | common/StackTextTitle.qml 32 | common/SwipeTextTitle.qml 33 | popups/PopupInfo.qml 34 | tabs/TitleAndTabBar.qml 35 | tabs/TabButtonIcon.qml 36 | tabs/TabButtonTextAndIcon.qml 37 | tabs/TitleAndIconTabBar.qml 38 | tabs/TitleAndIconTextTabBar.qml 39 | popups/PopupSettings.qml 40 | tabs/TitleWithTabBar.qml 41 | tabs/TitleWithIconTabBar.qml 42 | tabs/TitleWithIconTextTabBar.qml 43 | common/ButtonIconActive.qml 44 | 45 | 46 | -------------------------------------------------------------------------------- /tab_pages_x.pro: -------------------------------------------------------------------------------- 1 | # ekke (Ekkehard Gentz) @ekkescorner 2 | TEMPLATE = app 3 | TARGET = tab_pages_x 4 | 5 | QT += qml quick core 6 | CONFIG += c++11 7 | 8 | HEADERS += \ 9 | applicationui.hpp \ 10 | uiconstants.hpp 11 | 12 | SOURCES += main.cpp \ 13 | applicationui.cpp 14 | 15 | OTHER_FILES += main.qml \ 16 | common/*.qml \ 17 | pages/*.qml \ 18 | popups/*.qml \ 19 | tabs/*.qml 20 | 21 | OTHER_FILES += images/black/*.png \ 22 | images/black/x18/*.png \ 23 | images/black/x36/*.png \ 24 | images/black/x48/*.png \ 25 | images/white/*.png \ 26 | images/white/x18/*.png \ 27 | images/white/x36/*.png \ 28 | images/white/x48/*.png \ 29 | translations/*.* \ 30 | images/LICENSE \ 31 | LICENSE \ 32 | *.md 33 | 34 | RESOURCES += \ 35 | translations.qrc \ 36 | qml.qrc \ 37 | images.qrc 38 | 39 | # Additional import path used to resolve QML modules in Qt Creator's code model 40 | QML_IMPORT_PATH = 41 | 42 | # Default rules for deployment. 43 | include(deployment.pri) 44 | 45 | # T R A N S L A T I O N S 46 | 47 | # if languages are added: 48 | # 1. rebuild project to generate *.qm 49 | # 2. add existing .qm files to translations.qrc 50 | 51 | # if changes to translatable strings: 52 | # 1. Run Tools-External-Linguist-Update 53 | # 2. Run Linguist and do translations 54 | # 3. Build and run on iOS and Android to verify translations 55 | # 4. Optional: if translations not done: Run Tools-External-Linguist-Release 56 | 57 | # Supported languages 58 | LANGUAGES = de en 59 | 60 | # used to create .ts files 61 | defineReplace(prependAll) { 62 | for(a,$$1):result += $$2$${a}$$3 63 | return($$result) 64 | } 65 | # Available translations 66 | tsroot = $$join(TARGET,,,.ts) 67 | tstarget = $$join(TARGET,,,_) 68 | TRANSLATIONS = $$PWD/translations/$$tsroot 69 | TRANSLATIONS += $$prependAll(LANGUAGES, $$PWD/translations/$$tstarget, .ts) 70 | # run LRELEASE to generate the qm files 71 | qtPrepareTool(LRELEASE, lrelease) 72 | for(tsfile, TRANSLATIONS) { 73 | command = $$LRELEASE $$tsfile 74 | system($$command)|error("Failed to run: $$command") 75 | } 76 | -------------------------------------------------------------------------------- /common/SimpleTextTitle.qml: -------------------------------------------------------------------------------- 1 | // ekke (Ekkehard Gentz) @ekkescorner 2 | import QtQuick 2.9 3 | import QtQuick.Layouts 1.3 4 | import QtQuick.Controls 2.2 5 | import QtQuick.Controls.Material 2.2 6 | 7 | ToolBar { 8 | id: titleToolBar 9 | property alias text: titleLabel.text 10 | 11 | RowLayout { 12 | focus: false 13 | spacing: 6 14 | anchors.fill: parent 15 | LabelTitle { 16 | id: titleLabel 17 | text: "ekke" 18 | leftPadding: 16 19 | elide: Label.ElideRight 20 | horizontalAlignment: Qt.AlignHCenter 21 | verticalAlignment: Qt.AlignVCenter 22 | color: textOnPrimary 23 | } 24 | ToolButton { 25 | focusPolicy: Qt.NoFocus 26 | Image { 27 | id: buttonImage 28 | anchors.centerIn: parent 29 | source: "qrc:/images/"+iconOnPrimaryFolder+"/more_vert.png" 30 | } 31 | onClicked: { 32 | optionsMenu.open() 33 | } 34 | Menu { 35 | id: optionsMenu 36 | x: parent.width - width 37 | transformOrigin: Menu.TopRight 38 | MenuItem { 39 | text: isDarkTheme? qsTr("Light Theme") : qsTr("Dark Theme") 40 | onTriggered: { 41 | themePalette = myApp.swapThemePalette() 42 | } 43 | } 44 | MenuItem { 45 | text: qsTr("Select Primary Color") 46 | onTriggered: { 47 | popup.selectAccentColor = false 48 | popup.open() 49 | } 50 | } 51 | MenuItem { 52 | text: qsTr("Select Accent Color") 53 | onTriggered: { 54 | popup.selectAccentColor = true 55 | popup.open() 56 | } 57 | } 58 | onAboutToHide: { 59 | appWindow.resetFocus() 60 | } 61 | } // end optionsMenu 62 | 63 | } // end ToolButton 64 | } // end RowLayout 65 | } // end ToolBar 66 | 67 | 68 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # tab_pages_x 2 | Sample APP - Qt 5.7+ - Android iOS 3 | 4 | [AUTHOR ( ekke )](AUTHOR.md) 5 | 6 | This app is part of ekke's blog series about mobile x-platform development: 7 | http://j.mp/qt-x 8 | 9 | This is not a real-life app - this app only demonstrates the use of Material style and new Qt Quick Controls 2 10 | 11 | This app is a follow-up to 12 | * blog http://j.mp/qt-one-page-x (first app with Qt Quick Controls 2) 13 | * blog http://bit.ly/qt-stacked-pages-x (StackView) 14 | * blog http://bit.ly/qt-swiped-pages-x (SwipeView) 15 | please read these blogs and explroe corresponding apps before going on 16 | 17 | The topics of this fourth sample app: 18 | 19 | * Navigation with TabBar: fixed Tabs vs scrollable Tabs 20 | * Navigation by swiping from content 21 | * Navigation with Buttons 22 | * Navigation with Shortcut (physical keyboard attached, per ex. BlackBerry PRIV) 23 | * Dark Theme and selecting primary and accent color from options menu in ToolBar 24 | * Lazy instantiation of Pages using Loaders 25 | * Try out different ways to style TabBar 26 | 27 | Strings are marked as translatable, but not translated yet. See the first app to learn about i18n. 28 | 29 | This fourth sample app is a simple app only to demonstrate navigation through pages via Tabs and Swipe 30 | 31 | read more about this app here: 32 | http://bit.ly/qt-tab-pages-x 33 | 34 | This app needs Qt 5.7 RC or greater 35 | 36 | ## License Information 37 | [see LICENSE ( The Unlicense )](LICENSE) 38 | 39 | Images downloaded from https://design.google.com/icons/ - then renamed to match Qt High DPI images- and project-specific- naming 40 | 41 | [see /images/LICENSE ( cc-by )](images/LICENSE) 42 | 43 | ## Screenshots 44 | This sample app uses Material Design with UI Controls provided by Qt 5.7+ and was designed and tested on Android (BlackBerry PRIV Android 6.0.1) and iOS (iPhone 6s iOS 9.3). 45 | 46 | A detailed description you'll find at my blog: http://bit.ly/qt-tab-pages-x 47 | 48 | ### Screenshot Android 49 | ![alt tag](https://appbus.files.wordpress.com/2016/06/android_tab_01.png "Screenshot Android TabBar") 50 | 51 | ### Screenshot iOS 52 | ![alt tag](https://appbus.files.wordpress.com/2016/06/io2_tab_02.png "Screenshot iOS TabBar") 53 | 54 | more screenshots here: 55 | http://bit.ly/qt-tab-pages-x 56 | -------------------------------------------------------------------------------- /common/StackTextTitle.qml: -------------------------------------------------------------------------------- 1 | // ekke (Ekkehard Gentz) @ekkescorner 2 | import QtQuick 2.9 3 | import QtQuick.Layouts 1.3 4 | import QtQuick.Controls 2.2 5 | import QtQuick.Controls.Material 2.2 6 | 7 | ToolBar { 8 | id: titleToolBar 9 | property alias text: titleLabel.text 10 | 11 | RowLayout { 12 | focus: false 13 | spacing: 6 14 | anchors.fill: parent 15 | ToolButton { 16 | enabled: navPane.depth > 1 17 | focusPolicy: Qt.NoFocus 18 | Image { 19 | id: backImageImage 20 | visible: navPane.depth > 1 21 | anchors.centerIn: parent 22 | source: "qrc:/images/"+iconOnPrimaryFolder+"/arrow_back.png" 23 | } 24 | onClicked: { 25 | navPane.popOnePage() 26 | } 27 | } 28 | LabelTitle { 29 | id: titleLabel 30 | text: "ekke" 31 | // leftPadding: 16 32 | elide: Label.ElideRight 33 | horizontalAlignment: Qt.AlignHCenter 34 | verticalAlignment: Qt.AlignVCenter 35 | color: textOnPrimary 36 | } 37 | ToolButton { 38 | focusPolicy: Qt.NoFocus 39 | Image { 40 | id: buttonImage 41 | anchors.centerIn: parent 42 | source: "qrc:/images/"+iconOnPrimaryFolder+"/more_vert.png" 43 | } 44 | onClicked: { 45 | optionsMenu.open() 46 | } 47 | Menu { 48 | id: optionsMenu 49 | x: parent.width - width 50 | transformOrigin: Menu.TopRight 51 | MenuItem { 52 | text: isDarkTheme? qsTr("Light Theme") : qsTr("Dark Theme") 53 | onTriggered: { 54 | themePalette = myApp.swapThemePalette() 55 | } 56 | } 57 | MenuItem { 58 | text: qsTr("Select Primary Color") 59 | onTriggered: { 60 | popup.selectAccentColor = false 61 | popup.open() 62 | } 63 | } 64 | MenuItem { 65 | text: qsTr("Select Accent Color") 66 | onTriggered: { 67 | popup.selectAccentColor = true 68 | popup.open() 69 | } 70 | } 71 | onAboutToHide: { 72 | appWindow.resetFocus() 73 | } 74 | } // end optionsMenu 75 | 76 | } // end ToolButton 77 | } // end RowLayout 78 | } // end ToolBar 79 | 80 | 81 | -------------------------------------------------------------------------------- /common/SwipeTextTitle.qml: -------------------------------------------------------------------------------- 1 | // ekke (Ekkehard Gentz) @ekkescorner 2 | import QtQuick 2.9 3 | import QtQuick.Layouts 1.3 4 | import QtQuick.Controls 2.2 5 | import QtQuick.Controls.Material 2.2 6 | 7 | ToolBar { 8 | id: titleToolBar 9 | property alias text: titleLabel.text 10 | property bool backToolButtonVisible: navPane.currentIndex > 0 11 | 12 | RowLayout { 13 | focus: false 14 | spacing: 6 15 | anchors.fill: parent 16 | ToolButton { 17 | enabled: backToolButtonVisible 18 | focusPolicy: Qt.NoFocus 19 | Image { 20 | id: backImageImage 21 | visible: backToolButtonVisible 22 | anchors.centerIn: parent 23 | source: "qrc:/images/"+iconOnPrimaryFolder+"/arrow_back.png" 24 | } 25 | onClicked: { 26 | navPane.onePageBack() 27 | } 28 | } 29 | LabelTitle { 30 | id: titleLabel 31 | text: "ekke" 32 | // leftPadding: 16 33 | elide: Label.ElideRight 34 | horizontalAlignment: Qt.AlignHCenter 35 | verticalAlignment: Qt.AlignVCenter 36 | color: textOnPrimary 37 | } 38 | ToolButton { 39 | focusPolicy: Qt.NoFocus 40 | Image { 41 | id: buttonImage 42 | anchors.centerIn: parent 43 | source: "qrc:/images/"+iconOnPrimaryFolder+"/more_vert.png" 44 | } 45 | onClicked: { 46 | optionsMenu.open() 47 | } 48 | Menu { 49 | id: optionsMenu 50 | x: parent.width - width 51 | transformOrigin: Menu.TopRight 52 | MenuItem { 53 | text: isDarkTheme? qsTr("Light Theme") : qsTr("Dark Theme") 54 | onTriggered: { 55 | themePalette = myApp.swapThemePalette() 56 | } 57 | } 58 | MenuItem { 59 | text: qsTr("Select Primary Color") 60 | onTriggered: { 61 | popup.selectAccentColor = false 62 | popup.open() 63 | } 64 | } 65 | MenuItem { 66 | text: qsTr("Select Accent Color") 67 | onTriggered: { 68 | popup.selectAccentColor = true 69 | popup.open() 70 | } 71 | } 72 | onAboutToHide: { 73 | appWindow.resetFocus() 74 | } 75 | } // end optionsMenu 76 | 77 | } // end ToolButton 78 | } // end RowLayout 79 | } // end ToolBar 80 | 81 | 82 | -------------------------------------------------------------------------------- /pages/PageFour.qml: -------------------------------------------------------------------------------- 1 | // ekke (Ekkehard Gentz) @ekkescorner 2 | import QtQuick 2.9 3 | import QtQuick.Layouts 1.3 4 | import QtQuick.Controls 2.2 5 | import QtQuick.Controls.Material 2.2 6 | import QtGraphicalEffects 1.0 7 | import "../common" 8 | 9 | Flickable { 10 | id: flickable 11 | contentHeight: root.implicitHeight 12 | // StackView manages this, so please no anchors here 13 | // anchors.fill: parent 14 | property string name: "PageFour" 15 | property string title: qsTr("Truck") 16 | Pane { 17 | id: root 18 | anchors.fill: parent 19 | ColumnLayout { 20 | anchors.right: parent.right 21 | anchors.left: parent.left 22 | LabelHeadline { 23 | leftPadding: 10 24 | text: qsTr("Hello Truck Driver") 25 | } 26 | HorizontalDivider {} 27 | RowLayout { 28 | LabelSubheading { 29 | topPadding: 6 30 | bottomPadding: 6 31 | leftPadding: 10 32 | rightPadding: 10 33 | wrapMode: Text.WordWrap 34 | text: qsTr("Navigate between Pages:\n* Swipe with your fingers\n* Tap on a Tab\n* Tap on a Button\n\nTap on 'Settings' Button to configure TabBar\n\nFrom 'Option Menu' (three dots) placed top right in ToolBar you can switch Theme and change primary / accent colors\n\nBluetooth keyboard attached or BlackBerry PRIV?\n* Type '1', '2', '3', '4', '5' to go to the specific Tab\n* 'Space' or 'n' for the next Tab\n* 'Shift Space' or 'p' for the previous Tab\n") 35 | } 36 | } 37 | HorizontalDivider {} 38 | RowLayout { 39 | // implicite fillWidth = true 40 | spacing: 10 41 | ButtonIconActive { 42 | imageName: tabButtonModel[2].icon 43 | imageSize: 48 44 | onClicked: { 45 | navPane.goToPage(2) 46 | } 47 | } 48 | ButtonIconActive { 49 | imageName: tabButtonModel[4].icon 50 | imageSize: 48 51 | onClicked: { 52 | navPane.goToPage(4) 53 | } 54 | } 55 | } // button row 56 | } // col layout 57 | } // pane root 58 | ScrollIndicator.vertical: ScrollIndicator { } 59 | 60 | // emitting a Signal could be another option 61 | Component.onDestruction: { 62 | cleanup() 63 | } 64 | 65 | function whoAmI() { 66 | return qsTr("Message from Page Four [3]") 67 | } 68 | // called immediately after Loader.loaded 69 | function init() { 70 | console.log(qsTr("Init done from Four [3]")) 71 | } 72 | // called from Component.destruction 73 | function cleanup() { 74 | console.log(qsTr("Cleanup done from Four [3]")) 75 | } 76 | } // flickable 77 | -------------------------------------------------------------------------------- /pages/PageThree.qml: -------------------------------------------------------------------------------- 1 | // ekke (Ekkehard Gentz) @ekkescorner 2 | import QtQuick 2.9 3 | import QtQuick.Layouts 1.3 4 | import QtQuick.Controls 2.2 5 | import QtQuick.Controls.Material 2.2 6 | import QtGraphicalEffects 1.0 7 | import "../common" 8 | 9 | Flickable { 10 | id: flickable 11 | contentHeight: root.implicitHeight 12 | // StackView manages this, so please no anchors here 13 | // anchors.fill: parent 14 | property string name: "PageThree" 15 | property string title: qsTr("Subway") 16 | Pane { 17 | id: root 18 | anchors.fill: parent 19 | ColumnLayout { 20 | anchors.right: parent.right 21 | anchors.left: parent.left 22 | LabelHeadline { 23 | leftPadding: 10 24 | text: qsTr("GoTo next Subway Station") 25 | } 26 | HorizontalDivider {} 27 | RowLayout { 28 | LabelSubheading { 29 | topPadding: 6 30 | bottomPadding: 6 31 | leftPadding: 10 32 | rightPadding: 10 33 | wrapMode: Text.WordWrap 34 | text: qsTr("Navigate between Pages:\n* Swipe with your fingers\n* Tap on a Tab\n* Tap on a Button\n\nTap on 'Settings' Button to configure TabBar\n\nFrom 'Option Menu' (three dots) placed top right in ToolBar you can switch Theme and change primary / accent colors\n\nBluetooth keyboard attached or BlackBerry PRIV?\n* Type '1', '2', '3', '4', '5' to go to the specific Tab\n* 'Space' or 'n' for the next Tab\n* 'Shift Space' or 'p' for the previous Tab\n") 35 | } 36 | } 37 | HorizontalDivider {} 38 | RowLayout { 39 | // implicite fillWidth = true 40 | spacing: 10 41 | ButtonIconActive { 42 | imageName: tabButtonModel[1].icon 43 | imageSize: 48 44 | onClicked: { 45 | navPane.goToPage(1) 46 | } 47 | } 48 | ButtonIconActive { 49 | imageName: tabButtonModel[3].icon 50 | imageSize: 48 51 | onClicked: { 52 | navPane.goToPage(3) 53 | } 54 | } 55 | } // button row 56 | } // col layout 57 | } // pane root 58 | ScrollIndicator.vertical: ScrollIndicator { } 59 | 60 | // emitting a Signal could be another option 61 | Component.onDestruction: { 62 | cleanup() 63 | } 64 | 65 | function whoAmI() { 66 | return qsTr("Message from Page Three [2]") 67 | } 68 | // called immediately after Loader.loaded 69 | function init() { 70 | console.log(qsTr("Init done from Three [2]")) 71 | } 72 | // called from Component.destruction 73 | function cleanup() { 74 | console.log(qsTr("Cleanup done from Three [2]")) 75 | } 76 | } // flickable 77 | 78 | -------------------------------------------------------------------------------- /pages/PageOne.qml: -------------------------------------------------------------------------------- 1 | // ekke (Ekkehard Gentz) @ekkescorner 2 | import QtQuick 2.9 3 | import QtQuick.Layouts 1.3 4 | import QtQuick.Controls 2.2 5 | import QtQuick.Controls.Material 2.2 6 | import QtGraphicalEffects 1.0 7 | 8 | import "../common" 9 | 10 | Flickable { 11 | id: flickable 12 | contentHeight: root.implicitHeight 13 | // StackView manages this, so please no anchors here 14 | // anchors.fill: parent 15 | property string name: "PageOne" 16 | property string title: qsTr("Car") 17 | 18 | Pane { 19 | id: root 20 | anchors.fill: parent 21 | ColumnLayout { 22 | anchors.right: parent.right 23 | anchors.left: parent.left 24 | LabelHeadline { 25 | leftPadding: 10 26 | text: qsTr("Drive by Car") 27 | } 28 | HorizontalDivider {} 29 | RowLayout { 30 | LabelSubheading { 31 | topPadding: 6 32 | bottomPadding: 6 33 | leftPadding: 10 34 | rightPadding: 10 35 | wrapMode: Text.WordWrap 36 | text: qsTr("Navigate between Pages:\n* Swipe with your fingers\n* Tap on a Tab\n* Tap on a Button\n\nTap on 'Settings' Button to configure TabBar\n\nFrom 'Option Menu' (three dots) placed top right in ToolBar you can switch Theme and change primary / accent colors\n\nIn Landscape mode Title and Tabs are scrollable.\n\nBluetooth keyboard attached or BlackBerry PRIV?\n* Type '1', '2', '3', '4', '5' to go to the specific Tab\n* 'Space' or 'n' for the next Tab\n* 'Shift Space' or 'p' for the previous Tab\n") 37 | } 38 | } 39 | HorizontalDivider {} 40 | RowLayout { 41 | // implicite fillWidth = true 42 | spacing: 20 43 | ButtonIconActive { 44 | imageName: tabButtonModel[1].icon 45 | imageSize: 48 46 | onClicked: { 47 | navPane.goToPage(1) 48 | } 49 | ToolTip.visible: pressed 50 | ToolTip.delay: 500 51 | ToolTip.text: qsTr("Take a look at the Bus schedule") 52 | } 53 | LabelBodySecondary { 54 | rightPadding: 12 55 | text: qsTr("Tap on Bus Icon: after a short delay you'll see a ToolTip while pressing down.") 56 | wrapMode: Text.WordWrap 57 | } 58 | } // button row 59 | } // col layout 60 | } // root 61 | ScrollIndicator.vertical: ScrollIndicator { } 62 | 63 | // emitting a Signal could be another option 64 | Component.onDestruction: { 65 | cleanup() 66 | } 67 | 68 | function whoAmI() { 69 | return qsTr("Message from Page One [0]") 70 | } 71 | // called immediately after Loader.loaded 72 | function init() { 73 | console.log(qsTr("Init done from One [0]")) 74 | } 75 | // called from Component.destruction 76 | function cleanup() { 77 | console.log(qsTr("Cleanup done from One [0]")) 78 | } 79 | } // flickable 80 | -------------------------------------------------------------------------------- /pages/PageTwo.qml: -------------------------------------------------------------------------------- 1 | // ekke (Ekkehard Gentz) @ekkescorner 2 | import QtQuick 2.9 3 | import QtQuick.Layouts 1.3 4 | import QtQuick.Controls 2.2 5 | import QtQuick.Controls.Material 2.2 6 | import QtGraphicalEffects 1.0 7 | import "../common" 8 | 9 | Flickable { 10 | id: flickable 11 | contentHeight: root.implicitHeight 12 | // StackView manages this, so please no anchors here 13 | // anchors.fill: parent 14 | property string name: "PageTwo" 15 | property string title: qsTr("Bus") 16 | Pane { 17 | id: root 18 | anchors.fill: parent 19 | ColumnLayout { 20 | anchors.right: parent.right 21 | anchors.left: parent.left 22 | LabelHeadline { 23 | leftPadding: 10 24 | text: qsTr("Take a Bus") 25 | } 26 | HorizontalDivider {} 27 | RowLayout { 28 | LabelSubheading { 29 | topPadding: 6 30 | bottomPadding: 6 31 | leftPadding: 10 32 | rightPadding: 10 33 | wrapMode: Text.WordWrap 34 | text: qsTr("Navigate between Pages:\n* Swipe with your fingers\n* Tap on a Tab\n* Tap on a Button\n\nTap on 'Settings' Button to configure TabBar\n\nFrom 'Option Menu' (three dots) placed top right in ToolBar you can switch Theme and change primary / accent colors\n\nBluetooth keyboard attached or BlackBerry PRIV?\n* Type '1', '2', '3', '4', '5' to go to the specific Tab\n* 'Space' or 'n' for the next Tab\n* 'Shift Space' or 'p' for the previous Tab\n") 35 | } 36 | } 37 | HorizontalDivider {} 38 | RowLayout { 39 | // implicite fillWidth = true 40 | spacing: 10 41 | ButtonIconActive { 42 | imageName: tabButtonModel[0].icon 43 | imageSize: 48 44 | onClicked: { 45 | navPane.goToPage(0) 46 | } 47 | } 48 | ButtonIconActive { 49 | imageName: tabButtonModel[2].icon 50 | imageSize: 48 51 | onClicked: { 52 | navPane.goToPage(2) 53 | } 54 | } 55 | ButtonIconActive { 56 | imageName: tabButtonModel[4].icon 57 | imageSize: 48 58 | onClicked: { 59 | navPane.goToPage(4) 60 | } 61 | } 62 | } // button row 63 | } // col layout 64 | } // pane root 65 | ScrollIndicator.vertical: ScrollIndicator { } 66 | 67 | // emitting a Signal could be another option 68 | Component.onDestruction: { 69 | cleanup() 70 | } 71 | 72 | function whoAmI() { 73 | return qsTr("Message from Page Two [1]") 74 | } 75 | // called immediately after Loader.loaded 76 | function init() { 77 | console.log(qsTr("Init done from Two [1]")) 78 | } 79 | // called from Component.destruction 80 | function cleanup() { 81 | console.log(qsTr("Cleanup done from Two [1]")) 82 | } 83 | } // flickable 84 | -------------------------------------------------------------------------------- /applicationui.cpp: -------------------------------------------------------------------------------- 1 | // ekke (Ekkehard Gentz) @ekkescorner 2 | #include "applicationui.hpp" 3 | #include "uiconstants.hpp" 4 | 5 | #include 6 | 7 | using namespace ekke::constants; 8 | 9 | ApplicationUI::ApplicationUI(QObject *parent) : QObject(parent) 10 | { 11 | // default theme is light 12 | mIsDarkTheme = false; 13 | // default primary color is BlueGrey 14 | mPrimaryPalette = 18; 15 | // default accent color is orange 16 | mAccentPalette = 14; 17 | } 18 | 19 | /* Change Theme Palette */ 20 | QStringList ApplicationUI::swapThemePalette() 21 | { 22 | mIsDarkTheme = !mIsDarkTheme; 23 | if (mIsDarkTheme) { 24 | return darkPalette; 25 | } 26 | return lightPalette; 27 | } 28 | 29 | /* Get current default Theme Palette */ 30 | QStringList ApplicationUI::defaultThemePalette() 31 | { 32 | if (mIsDarkTheme) { 33 | return darkPalette; 34 | } 35 | return lightPalette; 36 | } 37 | 38 | /* Get one of the Primary Palettes */ 39 | QStringList ApplicationUI::primaryPalette(const int paletteIndex) 40 | { 41 | mPrimaryPalette = paletteIndex; 42 | switch (paletteIndex) { 43 | case 0: 44 | return materialRed; 45 | break; 46 | case 1: 47 | return materialPink; 48 | break; 49 | case 2: 50 | return materialPurple; 51 | break; 52 | case 3: 53 | return materialDeepPurple; 54 | break; 55 | case 4: 56 | return materialIndigo; 57 | break; 58 | case 5: 59 | return materialBlue; 60 | break; 61 | case 6: 62 | return materialLightBlue; 63 | break; 64 | case 7: 65 | return materialCyan; 66 | break; 67 | case 8: 68 | return materialTeal; 69 | break; 70 | case 9: 71 | return materialGreen; 72 | break; 73 | case 10: 74 | return materialLightGreen; 75 | break; 76 | case 11: 77 | return materialLime; 78 | break; 79 | case 12: 80 | return materialYellow; 81 | break; 82 | case 13: 83 | return materialAmber; 84 | break; 85 | case 14: 86 | return materialOrange; 87 | break; 88 | case 15: 89 | return materialDeepOrange; 90 | break; 91 | case 16: 92 | return materialBrown; 93 | break; 94 | case 17: 95 | return materialGrey; 96 | break; 97 | default: 98 | return materialBlueGrey; 99 | break; 100 | } 101 | } 102 | 103 | /* Get one of the Accent Palettes */ 104 | QStringList ApplicationUI::accentPalette(const int paletteIndex) 105 | { 106 | mAccentPalette = paletteIndex; 107 | int currentPrimary = mPrimaryPalette; 108 | QStringList thePalette = primaryPalette(paletteIndex); 109 | mPrimaryPalette = currentPrimary; 110 | // we need: primaryColor, textOnPrimary, iconOnPrimaryFolder 111 | return QStringList{thePalette.at(1), thePalette.at(4), thePalette.at(7)}; 112 | } 113 | 114 | /* Get Default Primary Palette */ 115 | QStringList ApplicationUI::defaultPrimaryPalette() 116 | { 117 | return primaryPalette(mPrimaryPalette); 118 | } 119 | 120 | /* Get Default Accent Palette */ 121 | QStringList ApplicationUI::defaultAccentPalette() 122 | { 123 | return accentPalette(mAccentPalette); 124 | } 125 | 126 | 127 | -------------------------------------------------------------------------------- /pages/PageFive.qml: -------------------------------------------------------------------------------- 1 | // ekke (Ekkehard Gentz) @ekkescorner 2 | import QtQuick 2.9 3 | import QtQuick.Layouts 1.3 4 | import QtQuick.Controls 2.2 5 | import QtQuick.Controls.Material 2.2 6 | import QtGraphicalEffects 1.0 7 | import "../common" 8 | 9 | Flickable { 10 | id: flickable 11 | contentHeight: root.implicitHeight 12 | // StackView manages this, so please no anchors here 13 | // anchors.fill: parent 14 | property string name: "PageFive" 15 | property string title: qsTr("Flight") 16 | Pane { 17 | id: root 18 | anchors.fill: parent 19 | ColumnLayout { 20 | anchors.right: parent.right 21 | anchors.left: parent.left 22 | LabelHeadline { 23 | leftPadding: 10 24 | text: qsTr("Take the next Flight") 25 | } 26 | HorizontalDivider {} 27 | RowLayout { 28 | LabelSubheading { 29 | topPadding: 6 30 | bottomPadding: 6 31 | leftPadding: 10 32 | rightPadding: 10 33 | wrapMode: Text.WordWrap 34 | text: qsTr("Navigate between Pages:\n* Swipe with your fingers\n* Tap on a Tab\n* Tap on a Button\n\nTap on 'Settings' Button to configure TabBar\n\nFrom 'Option Menu' (three dots) placed top right in ToolBar you can switch Theme and change primary / accent colors\n\nBluetooth keyboard attached or BlackBerry PRIV?\n* Type '1', '2', '3', '4', '5' to go to the specific Tab\n* 'Space' or 'n' for the next Tab\n* 'Shift Space' or 'p' for the previous Tab\n") 35 | } 36 | } 37 | HorizontalDivider{} 38 | RowLayout { 39 | // implicite fillWidth = true 40 | spacing: 10 41 | ButtonIconActive { 42 | imageName: tabButtonModel[3].icon 43 | imageSize: 48 44 | onClicked: { 45 | navPane.goToPage(3) 46 | } 47 | } 48 | ButtonIconActive { 49 | imageName: tabButtonModel[0].icon 50 | imageSize: 48 51 | onClicked: { 52 | navPane.goToPage(0) 53 | } 54 | } 55 | ButtonIconActive { 56 | imageName: tabButtonModel[2].icon 57 | imageSize: 48 58 | onClicked: { 59 | navPane.goToPage(2) 60 | } 61 | } 62 | } // button row 63 | HorizontalDivider {} 64 | LabelSubheading { 65 | id: statusLabel 66 | visible: text.length 67 | text: "" 68 | color: "red" 69 | } 70 | } // col layout 71 | } // pane root 72 | ScrollIndicator.vertical: ScrollIndicator { } 73 | 74 | // emitting a Signal could be another option 75 | Component.onDestruction: { 76 | cleanup() 77 | } 78 | 79 | function whoAmI() { 80 | return qsTr("Message from Page Five [4]") 81 | } 82 | // called immediately after Loader.loaded 83 | function init() { 84 | console.log(qsTr("Init done from Five [4]")) 85 | } 86 | // called from Component.destruction 87 | function cleanup() { 88 | console.log(qsTr("Cleanup done from Five [4]")) 89 | } 90 | } // flickable 91 | -------------------------------------------------------------------------------- /popups/PopupPalette.qml: -------------------------------------------------------------------------------- 1 | // ekke (Ekkehard Gentz) @ekkescorner 2 | import QtQuick 2.9 3 | import QtQuick.Layouts 1.3 4 | import QtQuick.Controls 2.2 5 | import QtQuick.Controls.Material 2.2 6 | import QtGraphicalEffects 1.0 7 | import "../common" 8 | 9 | Popup { 10 | id: popup 11 | property bool selectAccentColor: false 12 | Material.elevation: 8 13 | 14 | x: parent.width - width 15 | width: Math.min(appWindow.width, appWindow.height) / 3 * 2 16 | height: header? appWindow.height - header.height : appWindow.height 17 | transformOrigin: Popup.TopRight 18 | 19 | // Hint: as of Qt 5.7 Beta because of bug in dark theme, 20 | // background is too dark 21 | // https://bugreports.qt.io/browse/QTBUG-53266 22 | 23 | ListView { 24 | id: listView 25 | // Attention: clip should be used carefully, 26 | // but using a ListView inside a Popup 27 | // you must set it to true 28 | // otherwise content will appear outside while scrolling 29 | // don't clip at Paopup: will cut the elevation shadow 30 | clip: true 31 | currentIndex: -1 32 | anchors.fill: parent 33 | implicitHeight: popup.height 34 | delegate: Item { 35 | id: itemDelegate 36 | width: parent.width 37 | implicitHeight: 40 38 | Row { 39 | spacing: 0 40 | leftPadding: 10 41 | Rectangle { 42 | visible: selectAccentColor 43 | anchors.verticalCenter: parent.verticalCenter 44 | implicitHeight: 32 45 | implicitWidth: 48 46 | color: primaryColor 47 | } 48 | Rectangle { 49 | anchors.verticalCenter: parent.verticalCenter 50 | implicitHeight: 32 51 | implicitWidth: 32 52 | color: model.bg 53 | } 54 | LabelBody { 55 | leftPadding: 10 56 | anchors.verticalCenter: parent.verticalCenter 57 | text: model.title 58 | } 59 | } // end Row 60 | MouseArea { 61 | anchors.fill: parent 62 | onClicked: { 63 | if (selectAccentColor) { 64 | appWindow.switchAccentPalette(index) 65 | } else { 66 | appWindow.switchPrimaryPalette(index) 67 | } 68 | popup.close() 69 | } 70 | } // mouse 71 | } // end delegateItem 72 | 73 | model: ListModel { 74 | ListElement { title: qsTr("Material Red"); bg: "#F44336" } 75 | ListElement { title: qsTr("Material Pink"); bg: "#E91E63" } 76 | ListElement { title: qsTr("Material Purple"); bg: "#9C27B0" } 77 | ListElement { title: qsTr("Material DeepPurple"); bg: "#673AB7" } 78 | ListElement { title: qsTr("Material Indigo"); bg: "#3F51B5" } 79 | ListElement { title: qsTr("Material Blue"); bg: "#2196F3" } 80 | ListElement { title: qsTr("Material LightBlue"); bg: "#03A9F4" } 81 | ListElement { title: qsTr("Material Cyan"); bg: "#00BCD4" } 82 | ListElement { title: qsTr("Material Teal"); bg: "#009688" } 83 | ListElement { title: qsTr("Material Green"); bg: "#4CAF50" } 84 | ListElement { title: qsTr("Material LightGreen"); bg: "#8BC34A" } 85 | ListElement { title: qsTr("Material Lime"); bg: "#CDDC39" } 86 | ListElement { title: qsTr("Material Yellow"); bg: "#FFEB3B" } 87 | ListElement { title: qsTr("Material Amber"); bg: "#FFC107" } 88 | ListElement { title: qsTr("Material Orange"); bg: "#FF9800" } 89 | ListElement { title: qsTr("Material DeepOrange"); bg: "#FF5722" } 90 | ListElement { title: qsTr("Material Brown"); bg: "#795548" } 91 | ListElement { title: qsTr("Material Grey"); bg: "#9E9E9E" } 92 | ListElement { title: qsTr("Material BlueGrey"); bg: "#607D8B" } 93 | } 94 | ScrollIndicator.vertical: ScrollIndicator { } 95 | } // end listView 96 | } // end popup 97 | -------------------------------------------------------------------------------- /tabs/TitleWithIconTabBar.qml: -------------------------------------------------------------------------------- 1 | // ekke (Ekkehard Gentz) @ekkescorner 2 | import QtQuick 2.9 3 | import QtQuick.Layouts 1.3 4 | import QtQuick.Controls 2.2 5 | import QtQuick.Controls.Material 2.2 6 | import "../common" 7 | 8 | ToolBar { 9 | property alias text: titleLabel.text 10 | property bool backToolButtonVisible: false 11 | property alias currentIndex: myTabBar.currentIndex 12 | // explains how to calculate the height: 13 | property int defaultToolBar: 48 14 | property int defaultTabBar: 48 15 | // without this selected tab not marked 16 | property int landscapeExtra: isLandscape? 1 : 0 17 | height: defaultToolBar + defaultTabBar + landscapeExtra 18 | 19 | RowLayout { 20 | id: topRow 21 | focus: false 22 | spacing: 6 23 | anchors.left: parent.left 24 | anchors.right: parent.right 25 | ToolButton { 26 | enabled: backToolButtonVisible 27 | focusPolicy: Qt.NoFocus 28 | Image { 29 | id: backImageImage 30 | visible: backToolButtonVisible 31 | anchors.centerIn: parent 32 | source: "qrc:/images/"+iconOnPrimaryFolder+"/arrow_back.png" 33 | } 34 | onClicked: { 35 | navPane.onePageBack() 36 | } 37 | } 38 | LabelTitle { 39 | id: titleLabel 40 | text: "ekke" 41 | // leftPadding: 16 42 | elide: Label.ElideRight 43 | horizontalAlignment: Qt.AlignHCenter 44 | verticalAlignment: Qt.AlignVCenter 45 | color: textOnPrimary 46 | } 47 | ToolButton { 48 | focusPolicy: Qt.NoFocus 49 | Image { 50 | id: buttonImage 51 | anchors.centerIn: parent 52 | source: "qrc:/images/"+iconOnPrimaryFolder+"/more_vert.png" 53 | } 54 | onClicked: { 55 | optionsMenu.open() 56 | } 57 | Menu { 58 | id: optionsMenu 59 | x: parent.width - width 60 | transformOrigin: Menu.TopRight 61 | MenuItem { 62 | text: isDarkTheme? qsTr("Light Theme") : qsTr("Dark Theme") 63 | onTriggered: { 64 | themePalette = myApp.swapThemePalette() 65 | } 66 | } 67 | MenuItem { 68 | text: qsTr("Select Primary Color") 69 | onTriggered: { 70 | popup.selectAccentColor = false 71 | popup.open() 72 | } 73 | } 74 | MenuItem { 75 | text: qsTr("Select Accent Color") 76 | onTriggered: { 77 | popup.selectAccentColor = true 78 | popup.open() 79 | } 80 | } 81 | onAboutToHide: { 82 | appWindow.resetFocus() 83 | } 84 | } // end optionsMenu 85 | 86 | } // end ToolButton 87 | } // end RowLayout 88 | 89 | TabBar { 90 | id: myTabBar 91 | // we cannot customize the selectionBar, it's always accentColor 92 | // so we ov erwrite the accent 93 | Material.accent: textOnPrimary 94 | anchors.top: topRow.bottom 95 | anchors.left: parent.left 96 | anchors.right: parent.right 97 | currentIndex: 0 98 | onCurrentIndexChanged: { 99 | navPane.currentIndex = currentIndex 100 | } 101 | background: Rectangle { 102 | color: primaryColor 103 | } 104 | Repeater { 105 | model: tabButtonModel 106 | TabButtonIcon { 107 | theButtonColor: textOnPrimary 108 | theOpacity: index == navPane.currentIndex ? toolBarActiveOpacity : toolBarInactiveOpacity 109 | theIconFolder: iconOnPrimaryFolder 110 | hasOverlay: false 111 | } 112 | } // repeater 113 | 114 | } // myTabBar 115 | 116 | }// end ToolBar 117 | 118 | 119 | -------------------------------------------------------------------------------- /tabs/TitleWithIconTextTabBar.qml: -------------------------------------------------------------------------------- 1 | // ekke (Ekkehard Gentz) @ekkescorner 2 | import QtQuick 2.9 3 | import QtQuick.Layouts 1.3 4 | import QtQuick.Controls 2.2 5 | import QtQuick.Controls.Material 2.2 6 | import "../common" 7 | 8 | ToolBar { 9 | property alias text: titleLabel.text 10 | property bool backToolButtonVisible: false 11 | property alias currentIndex: myTabBar.currentIndex 12 | // explains how to calculate the height: 13 | property int defaultToolBar: 48 14 | property int iconPlusTabBar: 72 15 | // without this selected tab not marked 16 | property int landscapeExtra: isLandscape? 1 : 0 17 | height: defaultToolBar + iconPlusTabBar + landscapeExtra 18 | RowLayout { 19 | id: topRow 20 | focus: false 21 | spacing: 6 22 | // anchors.fill: parent 23 | anchors.left: parent.left 24 | anchors.right: parent.right 25 | ToolButton { 26 | enabled: backToolButtonVisible 27 | focusPolicy: Qt.NoFocus 28 | Image { 29 | id: backImageImage 30 | visible: backToolButtonVisible 31 | anchors.centerIn: parent 32 | source: "qrc:/images/"+iconOnPrimaryFolder+"/arrow_back.png" 33 | } 34 | onClicked: { 35 | navPane.onePageBack() 36 | } 37 | } 38 | LabelTitle { 39 | id: titleLabel 40 | text: "ekke" 41 | // leftPadding: 16 42 | elide: Label.ElideRight 43 | horizontalAlignment: Qt.AlignHCenter 44 | verticalAlignment: Qt.AlignVCenter 45 | color: textOnPrimary 46 | } 47 | ToolButton { 48 | focusPolicy: Qt.NoFocus 49 | Image { 50 | id: buttonImage 51 | anchors.centerIn: parent 52 | source: "qrc:/images/"+iconOnPrimaryFolder+"/more_vert.png" 53 | } 54 | onClicked: { 55 | optionsMenu.open() 56 | } 57 | Menu { 58 | id: optionsMenu 59 | x: parent.width - width 60 | transformOrigin: Menu.TopRight 61 | MenuItem { 62 | text: isDarkTheme? qsTr("Light Theme") : qsTr("Dark Theme") 63 | onTriggered: { 64 | themePalette = myApp.swapThemePalette() 65 | } 66 | } 67 | MenuItem { 68 | text: qsTr("Select Primary Color") 69 | onTriggered: { 70 | popup.selectAccentColor = false 71 | popup.open() 72 | } 73 | } 74 | MenuItem { 75 | text: qsTr("Select Accent Color") 76 | onTriggered: { 77 | popup.selectAccentColor = true 78 | popup.open() 79 | } 80 | } 81 | onAboutToHide: { 82 | appWindow.resetFocus() 83 | } 84 | } // end optionsMenu 85 | 86 | } // end ToolButton 87 | } // end RowLayout 88 | TabBar { 89 | id: myTabBar 90 | // we cannot customize the selectionBar, it's always accentColor 91 | // so we ov erwrite the accent 92 | Material.accent: textOnPrimary 93 | anchors.top: topRow.bottom 94 | anchors.left: parent.left 95 | anchors.right: parent.right 96 | currentIndex: 0 97 | onCurrentIndexChanged: { 98 | navPane.currentIndex = currentIndex 99 | } 100 | background: Rectangle { 101 | color: primaryColor 102 | } 103 | Repeater { 104 | model: tabButtonModel 105 | TabButtonTextAndIcon { 106 | theButtonColor: textOnPrimary 107 | theOpacity: index == navPane.currentIndex ? toolBarActiveOpacity : toolBarInactiveOpacity 108 | theIconFolder: iconOnPrimaryFolder 109 | hasOverlay: false 110 | } 111 | } // repeater 112 | 113 | } // myTabBar 114 | 115 | }// end ToolBar 116 | 117 | 118 | -------------------------------------------------------------------------------- /uiconstants.hpp: -------------------------------------------------------------------------------- 1 | #ifndef UICONSTANTS_HPP 2 | // ekke (Ekkehard Gentz) @ekkescorner 3 | #define UICONSTANTS_HPP 4 | 5 | namespace ekke { 6 | namespace constants { 7 | 8 | /* 9 | * P R I M A R Y colors 10 | * from Google Material Style Guide: 11 | * http://www.google.com/design/spec/style/color.html#color-color-palette 12 | * selected colors for primary light - primary - primary dark: 13 | * light: 100 - primary: 500 - dark: 700 14 | * from Qt 5.7 Material Style: 15 | * http://doc-snapshots.qt.io/qt5-5.7/qtquickcontrols2-material.html#pre-defined-colors 16 | * 17 | * QStringList contains: 18 | * {primaryLightColor, primaryColor, primaryDarkColor 19 | * textOnPrimaryLight, textOnPrimary, textOnPrimaryDark 20 | * iconOnPrimaryLightFolder, iconOnPrimaryFolder, iconOnPrimaryDarkFolder} 21 | * 22 | * In Qt 5.7 there are more ways tp get access to Material colors: 23 | * http://code.qt.io/cgit/qt/qtquickcontrols2.git/tree/src/imports/controls/material/qquickmaterialstyle_p.h?h=5.7#n235 24 | * to get access from QML: 25 | * import QtQuick 2.5 26 | * import QtQuick.Controls 2.0 27 | * import QtQuick.Controls.Material 2.0 28 | * color: Material.color(Material.Purple, Material.Shade900 29 | * I'll expolain this in another sample app 30 | */ 31 | 32 | static const QStringList materialRed {"#FFCDD2", "#F44336", "#D32F2F", "#000000", "#FFFFFF", "#FFFFFF", "black", "white", "white"}; 33 | static const QStringList materialPink {"#F8BBD0", "#E91E63", "#C2185B", "#000000", "#FFFFFF", "#FFFFFF", "black", "white", "white"}; 34 | static const QStringList materialPurple{"#E1BEE7", "#9C27B0", "#7B1FA2", "#000000", "#FFFFFF", "#FFFFFF", "black", "white", "white"}; 35 | static const QStringList materialDeepPurple{"#D1C4E9", "#673AB7", "#512DA8", "#000000", "#FFFFFF", "#FFFFFF", "black", "white", "white"}; 36 | static const QStringList materialIndigo{"#C5CAE9", "#3F51B5", "#303F9F", "#000000", "#FFFFFF", "#FFFFFF", "black", "white", "white"}; 37 | static const QStringList materialBlue{"#BBDEFB", "#2196F3", "#1976D2", "#000000", "#FFFFFF", "#FFFFFF", "black", "white", "white"}; 38 | static const QStringList materialLightBlue{"#B3E5FC", "#03A9F4", "#0288D1", "#000000", "#FFFFFF", "#FFFFFF", "black", "white", "white"}; 39 | static const QStringList materialCyan{"#B2EBF2", "#00BCD4", "#0097A7", "#000000", "#FFFFFF", "#FFFFFF", "black", "white", "white"}; 40 | static const QStringList materialTeal{"#B2DFDB", "#009688", "#00796B", "#000000", "#FFFFFF", "#FFFFFF", "black", "white", "white"}; 41 | static const QStringList materialGreen{"#C8E6C9", "#4CAF50", "#388E3C", "#000000", "#FFFFFF", "#FFFFFF", "black", "white", "white"}; 42 | static const QStringList materialLightGreen{"#DCEDC8", "#8BC34A", "#689F38", "#000000", "#000000", "#000000", "black", "black", "black"}; 43 | static const QStringList materialLime{"#F0F4C3", "#CDDC39", "#AFB42B", "#000000", "#000000", "#000000", "black", "black", "black"}; 44 | static const QStringList materialYellow{"#FFF9C4", "#FFEB3B", "#FBC02D", "#000000", "#000000", "#000000", "black", "black", "black"}; 45 | static const QStringList materialAmber{"#FFECB3", "#FFC107", "#FFA000", "#000000", "#000000", "#000000", "black", "black", "black"}; 46 | static const QStringList materialOrange{"#FFE0B2", "#FF9800", "#F57C00", "#000000", "#000000", "#000000", "black", "black", "black"}; 47 | static const QStringList materialDeepOrange{"#FFCCBC", "#FF5722", "#E64A19", "#000000", "#FFFFFF", "#FFFFFF", "black", "white", "white"}; 48 | static const QStringList materialBrown{"#D7CCC8", "#795548", "#5D4037", "#000000", "#FFFFFF", "#FFFFFF", "black", "white", "white"}; 49 | static const QStringList materialGrey{"#F5F5F5", "#9E9E9E", "#616161", "#000000", "#000000", "#FFFFFF", "black", "black", "white"}; 50 | static const QStringList materialBlueGrey{"#CFD8DC", "#607D8B", "#455A64", "#000000", "#FFFFFF", "#FFFFFF", "black", "white", "white"}; 51 | 52 | /* 53 | * T H E M E Light and Dark --- Default: Light 54 | * Colors, Opacity from Google Material Style Guide 55 | * 56 | * QStringList contains: 57 | * {dividerColor, cardAndDialogBackground, primaryTextOpacity, secondaryTextOpacity, dividerOpacity, 58 | * iconActiveOpacity, iconInactiveOpacity, iconFolder, isDark, flatButtonTextColor, popupTextColor, 59 | * toolBarActiveOpacity, toolBarInactiveOpacity} 60 | * 61 | */ 62 | static const QStringList darkPalette{"#FFFFFF", "#424242", "1.0", "0.70", "0.12", "1.0", "0.3", "white", "1", "#FFFFFF", "#FFFFFF", "1.0", "0.7"}; 63 | static const QStringList lightPalette{"#000000", "#FFFFFF", "0.87", "0.54", "0.12", "0.54", "0.26", "black", "0", "#424242", "#424242", "1.0", "0.7"}; 64 | 65 | } // namespace constants 66 | } // namespace ekke 67 | 68 | #endif // UICONSTANTS_HPP 69 | -------------------------------------------------------------------------------- /tabs/TitleWithTabBar.qml: -------------------------------------------------------------------------------- 1 | // ekke (Ekkehard Gentz) @ekkescorner 2 | import QtQuick 2.9 3 | import QtQuick.Layouts 1.3 4 | import QtQuick.Controls 2.2 5 | import QtQuick.Controls.Material 2.2 6 | import "../common" 7 | 8 | ToolBar { 9 | property alias text: titleLabel.text 10 | property bool backToolButtonVisible: false 11 | property alias currentIndex: myTabBar.currentIndex 12 | // explains how to calculate the height: 13 | property int defaultToolBar: 48 14 | property int defaultTabBar: 48 15 | // without this selected tab not marked 16 | property int landscapeExtra: isLandscape? 1 : 0 17 | height: defaultToolBar + defaultTabBar + landscapeExtra 18 | RowLayout { 19 | id: topRow 20 | focus: false 21 | spacing: 6 22 | anchors.left: parent.left 23 | anchors.right: parent.right 24 | ToolButton { 25 | enabled: backToolButtonVisible 26 | focusPolicy: Qt.NoFocus 27 | Image { 28 | id: backImageImage 29 | visible: backToolButtonVisible 30 | anchors.centerIn: parent 31 | source: "qrc:/images/"+iconOnPrimaryFolder+"/arrow_back.png" 32 | } 33 | onClicked: { 34 | navPane.onePageBack() 35 | } 36 | } 37 | LabelTitle { 38 | id: titleLabel 39 | text: "ekke" 40 | // leftPadding: 16 41 | elide: Label.ElideRight 42 | horizontalAlignment: Qt.AlignHCenter 43 | verticalAlignment: Qt.AlignVCenter 44 | color: textOnPrimary 45 | } 46 | ToolButton { 47 | focusPolicy: Qt.NoFocus 48 | Image { 49 | id: buttonImage 50 | anchors.centerIn: parent 51 | source: "qrc:/images/"+iconOnPrimaryFolder+"/more_vert.png" 52 | } 53 | onClicked: { 54 | optionsMenu.open() 55 | } 56 | Menu { 57 | id: optionsMenu 58 | x: parent.width - width 59 | transformOrigin: Menu.TopRight 60 | MenuItem { 61 | text: isDarkTheme? qsTr("Light Theme") : qsTr("Dark Theme") 62 | onTriggered: { 63 | themePalette = myApp.swapThemePalette() 64 | } 65 | } 66 | MenuItem { 67 | text: qsTr("Select Primary Color") 68 | onTriggered: { 69 | popup.selectAccentColor = false 70 | popup.open() 71 | } 72 | } 73 | MenuItem { 74 | text: qsTr("Select Accent Color") 75 | onTriggered: { 76 | popup.selectAccentColor = true 77 | popup.open() 78 | } 79 | } 80 | onAboutToHide: { 81 | appWindow.resetFocus() 82 | } 83 | } // end optionsMenu 84 | 85 | } // end ToolButton 86 | } // end RowLayout 87 | 88 | TabBar { 89 | id: myTabBar 90 | // we cannot customize the selectionBar, it's always accentColor 91 | // so we ov erwrite the accent 92 | Material.accent: textOnPrimary 93 | anchors.top: topRow.bottom 94 | anchors.left: parent.left 95 | anchors.right: parent.right 96 | currentIndex: 0 97 | onCurrentIndexChanged: { 98 | navPane.currentIndex = currentIndex 99 | } 100 | background: Rectangle { 101 | color: primaryColor 102 | } 103 | Repeater { 104 | model: tabButtonModel 105 | TabButton { 106 | focusPolicy: Qt.NoFocus 107 | height: 48 108 | contentItem: 109 | Item { 110 | LabelBody { 111 | anchors.top: parent.top 112 | anchors.horizontalCenter: parent.horizontalCenter 113 | verticalAlignment: Text.AlignVCenter 114 | horizontalAlignment: Text.AlignHCenter 115 | font.capitalization: Font.AllUppercase 116 | font.weight: Font.Medium 117 | color: textOnPrimary 118 | opacity: index == navPane.currentIndex? toolBarActiveOpacity : toolBarInactiveOpacity 119 | text: modelData.name 120 | } 121 | } // content item 122 | text: modelData.name 123 | width: tabBarIsFixed? myTabBar.width / tabButtonModel.length : Math.max(112, myTabBar.width / tabButtonModel.length) 124 | } 125 | } // repeater 126 | 127 | } // myTabBar 128 | 129 | }// end ToolBar 130 | 131 | 132 | -------------------------------------------------------------------------------- /popups/PopupSettings.qml: -------------------------------------------------------------------------------- 1 | // ekke (Ekkehard Gentz) @ekkescorner 2 | import QtQuick 2.9 3 | import QtQuick.Layouts 1.3 4 | import QtQuick.Controls 2.2 5 | import QtQuick.Controls.Material 2.2 6 | import QtGraphicalEffects 1.0 7 | import "../common" 8 | 9 | Popup { 10 | id: popup 11 | property bool tabBarIsFixedSettings: tabBarIsFixed 12 | property int tabButtonDesignSettings: tabButtonDesign 13 | property bool tabBarInsideTitleBarSettings: tabBarInsideTitleBar 14 | // default behavior for this Popup: OK Button Clicked 15 | property bool isOk: true 16 | Material.elevation: 8 17 | x: parent.width - width - 12 18 | y: parent.height - height - 12 19 | width: Math.min(appWindow.width, appWindow.height) / 3 * 2 20 | height: Math.min(appWindow.height, theContent.height +10) 21 | 22 | Flickable { 23 | contentHeight: popup.height 24 | anchors.fill: parent 25 | // Attention: clip should be used carefully, 26 | // but using a ListView inside a Popup 27 | // you must set it to true 28 | // otherwise content will appear outside while scrolling 29 | // don't clip at Paopup: will cut the elevation shadow 30 | clip: true 31 | 32 | ColumnLayout { 33 | id: theContent 34 | anchors.right: parent.right 35 | anchors.left: parent.left 36 | spacing: 6 37 | LabelSubheading { 38 | text: qsTr("Settings TabBar") 39 | color: accentColor 40 | } 41 | RowLayout { 42 | Switch { 43 | focusPolicy: Qt.NoFocus 44 | topPadding: 6 45 | leftPadding: 12 46 | text: qsTr("Tabs Scrollable") 47 | checked: !tabBarIsFixedSettings 48 | onCheckedChanged: { 49 | tabBarIsFixedSettings = !checked 50 | } 51 | } // switch scrollable 52 | } // row switch scroll 53 | RowLayout { 54 | Switch { 55 | focusPolicy: Qt.NoFocus 56 | leftPadding: 12 57 | text: qsTr("Tabs inside TitleBar") 58 | checked: tabBarInsideTitleBar 59 | onCheckedChanged: { 60 | tabBarInsideTitleBarSettings = checked 61 | } 62 | } // switch scrollable 63 | } // row switch inside 64 | RowLayout { 65 | Frame { 66 | ColumnLayout { 67 | anchors.fill: parent 68 | spacing: 6 69 | RadioButton { 70 | id: radioText 71 | focusPolicy: Qt.NoFocus 72 | text: qsTr("Buttons Text only") 73 | checked: tabButtonDesignSettings == 0 74 | onCheckedChanged: { 75 | tabButtonDesignSettings = 0 76 | } 77 | } 78 | RadioButton { 79 | id: radioIcon 80 | focusPolicy: Qt.NoFocus 81 | text: qsTr("Buttons Icon only") 82 | checked: tabButtonDesignSettings == 1 83 | onCheckedChanged: { 84 | tabButtonDesignSettings = 1 85 | } 86 | } 87 | RadioButton { 88 | id: radioTextAndIcon 89 | focusPolicy: Qt.NoFocus 90 | text: qsTr("Buttons Icon and Text") 91 | checked: tabButtonDesignSettings == 2 92 | onCheckedChanged: { 93 | tabButtonDesignSettings = 2 94 | } 95 | } 96 | } 97 | } 98 | } // radiobuttons design 99 | 100 | 101 | RowLayout { 102 | ButtonFlat { 103 | id: cancelButton 104 | text: qsTr("Cancel") 105 | textColor: popupTextColor 106 | opacity: opacityBodySecondary 107 | onClicked: { 108 | isOk = false 109 | popup.close() 110 | } 111 | } // cancelButton 112 | ButtonFlat { 113 | id: okButton 114 | text: qsTr("OK") 115 | textColor: accentColor 116 | onClicked: { 117 | isOk = true 118 | popup.close() 119 | } 120 | } // okButton 121 | } // row button 122 | 123 | } // col layout 124 | 125 | ScrollIndicator.vertical: ScrollIndicator { } 126 | 127 | } // flickable 128 | 129 | function update() { 130 | if(isOk) { 131 | tabBarIsFixed = tabBarIsFixedSettings 132 | tabButtonDesign = tabButtonDesignSettings 133 | tabBarInsideTitleBar = tabBarInsideTitleBarSettings 134 | } 135 | } 136 | 137 | } // popup 138 | -------------------------------------------------------------------------------- /main.qml: -------------------------------------------------------------------------------- 1 | // ekke (Ekkehard Gentz) @ekkescorner 2 | import QtQuick 2.9 3 | import QtQuick.Layouts 1.3 4 | import QtQuick.Controls 2.2 5 | import QtQuick.Controls.Material 2.2 6 | import QtGraphicalEffects 1.0 7 | import "common" 8 | import "pages" 9 | import "popups" 10 | import "tabs" 11 | 12 | // This app demonstrates HowTo use Qt 5.8 and Qt Quick Controls 2.1, High DPI and more 13 | // This app is NOT a production ready app 14 | // This app's goal is only to help you to understand some concepts 15 | // see blog http://j.mp/qt-x to learn about Qt 5.8 for Material - styled Android or iOS Apps 16 | // learn about this tab_pages_x app from this article: http://bit.ly/qt-tab-pages-x 17 | // ekke (Ekkehard gentz) @ekkescorner 18 | 19 | ApplicationWindow { 20 | id: appWindow 21 | // visibile must set to true - default is false 22 | visible: true 23 | // 24 | property bool isLandscape: width > height 25 | 26 | // primary and accent properties: 27 | property variant primaryPalette: myApp.defaultPrimaryPalette() 28 | property color primaryLightColor: primaryPalette[0] 29 | property color primaryColor: primaryPalette[1] 30 | property color primaryDarkColor: primaryPalette[2] 31 | property color textOnPrimaryLight: primaryPalette[3] 32 | property color textOnPrimary: primaryPalette[4] 33 | property color textOnPrimaryDark: primaryPalette[5] 34 | property string iconOnPrimaryLightFolder: primaryPalette[6] 35 | property string iconOnPrimaryFolder: primaryPalette[7] 36 | property string iconOnPrimaryDarkFolder: primaryPalette[8] 37 | property variant accentPalette: myApp.defaultAccentPalette() 38 | property color accentColor: accentPalette[0] 39 | property color textOnAccent: accentPalette[1] 40 | property string iconOnAccentFolder: accentPalette[2] 41 | Material.primary: primaryColor 42 | Material.accent: accentColor 43 | // theme Dark vs Light properties: 44 | property variant themePalette: myApp.defaultThemePalette() 45 | property color dividerColor: themePalette[0] 46 | property color cardAndDialogBackground: themePalette[1] 47 | property real primaryTextOpacity: themePalette[2] 48 | property real secondaryTextOpacity: themePalette[3] 49 | property real dividerOpacity: themePalette[4] 50 | property real iconActiveOpacity: themePalette[5] 51 | property real iconInactiveOpacity: themePalette[6] 52 | property string iconFolder: themePalette[7] 53 | property int isDarkTheme: themePalette[8] 54 | property color flatButtonTextColor: themePalette[9] 55 | property color popupTextColor: themePalette[10] 56 | property real toolBarActiveOpacity: themePalette[11] 57 | property real toolBarInactiveOpacity: themePalette[12] 58 | // Material.dropShadowColor OK for Light, but too dark for dark theme 59 | property color dropShadow: isDarkTheme? "#E4E4E4" : Material.dropShadowColor 60 | onIsDarkThemeChanged: { 61 | if(isDarkTheme == 1) { 62 | Material.theme = Material.Dark 63 | } else { 64 | Material.theme = Material.Light 65 | } 66 | } 67 | // font sizes - defaults from Google Material Design Guide 68 | property int fontSizeDisplay4: 112 69 | property int fontSizeDisplay3: 56 70 | property int fontSizeDisplay2: 45 71 | property int fontSizeDisplay1: 34 72 | property int fontSizeHeadline: 24 73 | property int fontSizeTitle: 20 74 | property int fontSizeSubheading: 16 75 | property int fontSizeBodyAndButton: 14 // is Default 76 | property int fontSizeCaption: 12 77 | // fonts are grouped into primary and secondary with different Opacity 78 | // to make it easier to get the right property, 79 | // here's the opacity per size: 80 | property real opacityDisplay4: secondaryTextOpacity 81 | property real opacityDisplay3: secondaryTextOpacity 82 | property real opacityDisplay2: secondaryTextOpacity 83 | property real opacityDisplay1: secondaryTextOpacity 84 | property real opacityHeadline: primaryTextOpacity 85 | property real opacityTitle: primaryTextOpacity 86 | property real opacitySubheading: primaryTextOpacity 87 | // body can be both: primary or secondary text 88 | property real opacityBodyAndButton: primaryTextOpacity 89 | property real opacityBodySecondary: secondaryTextOpacity 90 | property real opacityCaption: secondaryTextOpacity 91 | // 92 | 93 | // TabBar properties 94 | property string titleAndTabBarSource: "tabs/TitleWithTabBar.qml" 95 | property bool tabBarIsFixed: true 96 | property bool tabBarInsideTitleBar: true 97 | onTabBarInsideTitleBarChanged: { 98 | if (tabBarInsideTitleBar) { 99 | if(tabButtonTextOnly) { 100 | titleAndTabBarSource = "tabs/TitleWithTabBar.qml" 101 | return 102 | } 103 | if(tabButtonIconOnly) { 104 | titleAndTabBarSource = "tabs/TitleWithIconTabBar.qml" 105 | return 106 | } 107 | if(tabButtonTextAndIcon) { 108 | titleAndTabBarSource = "tabs/TitleWithIconTextTabBar.qml" 109 | return 110 | } 111 | } else { 112 | if(tabButtonTextOnly) { 113 | titleAndTabBarSource = "tabs/TitleAndTabBar.qml" 114 | return 115 | } 116 | if(tabButtonIconOnly) { 117 | titleAndTabBarSource = "tabs/TitleAndIconTabBar.qml" 118 | return 119 | } 120 | if(tabButtonTextAndIcon) { 121 | titleAndTabBarSource = "tabs/TitleAndIconTextTabBar.qml" 122 | return 123 | } 124 | } 125 | } 126 | property int tabButtonDesign: 0 127 | property bool tabButtonTextOnly: tabButtonDesign == 0 128 | onTabButtonTextOnlyChanged: { 129 | if(tabButtonTextOnly) { 130 | if (tabBarInsideTitleBar) { 131 | titleAndTabBarSource = "tabs/TitleWithTabBar.qml" 132 | } else { 133 | titleAndTabBarSource = "tabs/TitleAndTabBar.qml" 134 | } 135 | } 136 | } 137 | property bool tabButtonIconOnly: tabButtonDesign == 1 138 | onTabButtonIconOnlyChanged: { 139 | if(tabButtonIconOnly) { 140 | if (tabBarInsideTitleBar) { 141 | titleAndTabBarSource = "tabs/TitleWithIconTabBar.qml" 142 | } else { 143 | titleAndTabBarSource = "tabs/TitleAndIconTabBar.qml" 144 | } 145 | } 146 | } 147 | property bool tabButtonTextAndIcon: tabButtonDesign == 2 148 | onTabButtonTextAndIconChanged: { 149 | if(tabButtonTextAndIcon) { 150 | if (tabBarInsideTitleBar) { 151 | titleAndTabBarSource = "tabs/TitleWithIconTextTabBar.qml" 152 | } else { 153 | titleAndTabBarSource = "tabs/TitleAndIconTextTabBar.qml" 154 | } 155 | } 156 | } 157 | 158 | property var tabButtonModel: [{"name": "Car", "icon": "car.png"}, 159 | {"name": "Bus", "icon": "bus.png"}, 160 | {"name": "Subway", "icon": "subway.png"}, 161 | {"name": "Truck", "icon": "truck.png"}, 162 | {"name": "Flight", "icon": "flight.png"}] 163 | // header only used in PORTRAIT to provide a fixed TitleBar 164 | header: isLandscape? null : titleBar 165 | 166 | Loader { 167 | id: titleBar 168 | visible: !isLandscape 169 | active: !isLandscape 170 | source: titleAndTabBarSource 171 | onLoaded: { 172 | if(item) { 173 | item.currentIndex = navPane.currentIndex 174 | item.text = qsTr("HowTo move from A to B") 175 | } 176 | } 177 | } 178 | // in LANDSCAPE header is null and we have a floating TitleBar 179 | // hint: TitleBar shadow not visible in Landscape 180 | // reason: TabBar must be defined inside ToolBar 181 | // but they're defined in column layout - haven't redesigned for this example 182 | // only wanted to demonstrate HowTo use fix and floating Titles 183 | Loader { 184 | id: titleBarFloating 185 | visible: isLandscape 186 | anchors.top: parent.top 187 | anchors.left: parent.left 188 | anchors.right: parent.right 189 | active: isLandscape 190 | source: titleAndTabBarSource 191 | onLoaded: { 192 | if(item) { 193 | item.currentIndex = navPane.currentIndex 194 | item.text = qsTr("HowTo move from A to B") 195 | } 196 | } 197 | } 198 | 199 | FloatingActionButton { 200 | id: fab 201 | property string imageName: "/settings.png" 202 | z: 1 203 | anchors.margins: 16 204 | anchors.right: parent.right 205 | anchors.bottom: parent.bottom 206 | imageSource: "qrc:/images/"+iconOnAccentFolder+imageName 207 | backgroundColor: accentColor 208 | onClicked: { 209 | showSettings() 210 | } 211 | } // FAB 212 | 213 | SwipeView { 214 | id: navPane 215 | focus: true 216 | // anchors.fill: parent 217 | anchors.top: isLandscape? titleBarFloating.bottom : parent.top 218 | anchors.topMargin: isLandscape? 6 : 0 219 | anchors.left: parent.left 220 | anchors.right: parent.right 221 | anchors.bottom: parent.bottom 222 | currentIndex: 0 223 | // currentIndex is the NEXT index swiped to 224 | onCurrentIndexChanged: { 225 | if(isLandscape) { 226 | titleBarFloating.item.currentIndex = currentIndex 227 | } else { 228 | titleBar.item.currentIndex = currentIndex 229 | } 230 | switch(currentIndex) { 231 | case 1: 232 | pageThreeLoader.active = true 233 | break; 234 | case 2: 235 | pageThreeLoader.active = true 236 | pageFourLoader.active = true 237 | break; 238 | case 3: 239 | pageThreeLoader.active = true 240 | pageFourLoader.active = true 241 | pageFiveLoader.active = true 242 | break; 243 | case 4: 244 | pageFourLoader.active = true 245 | pageFiveLoader.active = true 246 | break; 247 | } 248 | } 249 | 250 | // support of BACK key 251 | property bool firstPageInfoRead: false 252 | Keys.onBackPressed: { 253 | event.accepted = navPane.currentIndex > 0 || !firstPageInfoRead 254 | if(navPane.currentIndex > 0) { 255 | onePageBack() 256 | return 257 | } 258 | // first time we reached first tab 259 | // user gets Popupo Info 260 | // hitting again BACK will close the app 261 | if(!firstPageInfoRead) { 262 | firstPageReached() 263 | } 264 | // We don't have to manually cleanup loaded Pages 265 | // While shutting down the app, all loaded Pages will be deconstructed 266 | // and cleanup called 267 | } 268 | 269 | // some keyboard shortcuts if: 270 | // * running on BlackBerry PRIV (Slider with hardware keyboard) 271 | // * or attached Bluetooth Keyboard 272 | // Jump to Page 1 (w), 2 (e), 3 (r), 4 (s), 5(d) 273 | // Goto next tab: 'n' or 'space' 274 | // Goto previous tab: 'p' or 'shift' + 'space' 275 | Shortcut { 276 | sequence: "w" 277 | onActivated: navPane.goToPage(0) 278 | } 279 | Shortcut { 280 | sequence: "Alt+w" 281 | onActivated: navPane.goToPage(0) 282 | } 283 | Shortcut { 284 | sequence: "e" 285 | onActivated: navPane.goToPage(1) 286 | } 287 | Shortcut { 288 | sequence: "Alt+e" 289 | onActivated: navPane.goToPage(1) 290 | } 291 | Shortcut { 292 | sequence: "r" 293 | onActivated: navPane.goToPage(2) 294 | } 295 | Shortcut { 296 | sequence: "Alt+r" 297 | onActivated: navPane.goToPage(2) 298 | } 299 | Shortcut { 300 | sequence: "s" 301 | onActivated: navPane.goToPage(3) 302 | } 303 | Shortcut { 304 | sequence: "Alt+s" 305 | onActivated: navPane.goToPage(3) 306 | } 307 | Shortcut { 308 | sequence: "d" 309 | onActivated: navPane.goToPage(4) 310 | } 311 | Shortcut { 312 | sequence: "Alt+d" 313 | onActivated: navPane.goToPage(4) 314 | } 315 | // n == NEXT 316 | Shortcut { 317 | sequence: "n" 318 | onActivated: navPane.onePageForward() 319 | } 320 | // p == PREVIOUS 321 | Shortcut { 322 | sequence: "p" 323 | onActivated: navPane.onePageBack() 324 | } 325 | Shortcut { 326 | sequence: " " 327 | onActivated: navPane.onePageForward() 328 | } 329 | Shortcut { 330 | sequence: "Shift+ " 331 | onActivated: navPane.onePageBack() 332 | } 333 | function onePageBack() { 334 | if(navPane.currentIndex == 0) { 335 | firstPageReached() 336 | return 337 | } 338 | navPane.goToPage(currentIndex - 1) 339 | } // onePageBack 340 | 341 | function onePageForward() { 342 | if(navPane.currentIndex == 4) { 343 | lastPageReached() 344 | return 345 | } 346 | navPane.goToPage(currentIndex + 1) 347 | } 348 | 349 | function goToPage(pageIndex) { 350 | if(pageIndex == navPane.currentIndex) { 351 | // it's the current page 352 | return 353 | } 354 | if(pageIndex > 4 || pageIndex < 0) { 355 | return 356 | } 357 | navPane.currentIndex = pageIndex 358 | } // goToPage 359 | // Page 1 and 2 preloaded to be able to swipe 360 | // other pages will be lazy loaded first time they're needed 361 | Loader { 362 | // index 0 363 | id: pageOneLoader 364 | active: true 365 | source: "pages/PageOne.qml" 366 | onLoaded: item.init() 367 | } 368 | Loader { 369 | // index 1 370 | id: pageTwoLoader 371 | active: true 372 | source: "pages/PageTwo.qml" 373 | onLoaded: item.init() 374 | } 375 | Loader { 376 | // index 2 377 | id: pageThreeLoader 378 | active: false 379 | source: "pages/PageThree.qml" 380 | onLoaded: item.init() 381 | } 382 | Loader { 383 | // index 3 384 | id: pageFourLoader 385 | active: false 386 | source: "pages/PageFour.qml" 387 | onLoaded: item.init() 388 | } 389 | Loader { 390 | // index 4 391 | id: pageFiveLoader 392 | active: false 393 | source: "pages/PageFive.qml" 394 | onLoaded: item.init() 395 | } 396 | 397 | } // navPane 398 | 399 | function switchPrimaryPalette(paletteIndex) { 400 | primaryPalette = myApp.primaryPalette(paletteIndex) 401 | } 402 | function switchAccentPalette(paletteIndex) { 403 | accentPalette = myApp.accentPalette(paletteIndex) 404 | } 405 | 406 | // we can loose the focus if Menu or Popup is opened 407 | function resetFocus() { 408 | navPane.focus = true 409 | } 410 | 411 | // 412 | PopupPalette { 413 | id: popup 414 | onAboutToHide: { 415 | resetFocus() 416 | } 417 | } 418 | 419 | function firstPageReached() { 420 | popupInfo.text = qsTr("No more Tabs\nLeftmost Tab reached") 421 | popupInfo.buttonText = qsTr("OK") 422 | popupInfo.open() 423 | navPane.firstPageInfoRead = true 424 | } 425 | function lastPageReached() { 426 | popupInfo.text = qsTr("No more Tabs\nRightmost Tab reached") 427 | popupInfo.buttonText = qsTr("OK") 428 | popupInfo.open() 429 | } 430 | function pageNotValid(pageNumber) { 431 | popupInfo.text = qsTr("Page %1 not valid.\nPlease tap 'Done' Button","").arg(pageNumber) 432 | popupInfo.buttonText = qsTr("So Long, and Thx For All The Fish") 433 | popupInfo.open() 434 | } 435 | function showInfo(info) { 436 | popupInfo.text = info 437 | popupInfo.buttonText = qsTr("OK") 438 | popupInfo.open() 439 | } 440 | function showSettings() { 441 | popupSettings.tabBarIsFixedSettings = tabBarIsFixed 442 | popupSettings.open() 443 | } 444 | 445 | // Unfortunately no SIGNAL if end or beginning reached from SWIPE GESTURE 446 | // so at the moment user gets no visual feedback 447 | // TODO Bugreport 448 | PopupInfo { 449 | id: popupInfo 450 | onAboutToHide: { 451 | popupInfo.stopTimer() 452 | resetFocus() 453 | } 454 | } // popupInfo 455 | 456 | // PopupSettings 457 | PopupSettings { 458 | id: popupSettings 459 | onAboutToHide: { 460 | popupSettings.update() 461 | resetFocus() 462 | } 463 | } // popupSettings 464 | 465 | } // app window 466 | -------------------------------------------------------------------------------- /images.qrc: -------------------------------------------------------------------------------- 1 | 2 | 3 | images/black/more_vert.png 4 | images/black/more_vert@2x.png 5 | images/black/more_vert@3x.png 6 | images/black/more_vert@4x.png 7 | images/white/more_vert.png 8 | images/white/more_vert@2x.png 9 | images/white/more_vert@3x.png 10 | images/white/more_vert@4x.png 11 | images/white/person.png 12 | images/white/person@2x.png 13 | images/white/person@3x.png 14 | images/white/person@4x.png 15 | images/black/person.png 16 | images/black/person@2x.png 17 | images/black/person@3x.png 18 | images/black/person@4x.png 19 | images/black/x36/person.png 20 | images/black/x36/person@2x.png 21 | images/black/x36/person@3x.png 22 | images/black/x36/person@4x.png 23 | images/white/x36/person.png 24 | images/white/x36/person@2x.png 25 | images/white/x36/person@3x.png 26 | images/white/x36/person@4x.png 27 | images/black/x18/person.png 28 | images/black/x18/person@2x.png 29 | images/black/x18/person@3x.png 30 | images/black/x18/person@4x.png 31 | images/black/x48/person.png 32 | images/black/x48/person@2x.png 33 | images/black/x48/person@3x.png 34 | images/black/x48/person@4x.png 35 | images/white/x18/person.png 36 | images/white/x18/person@2x.png 37 | images/white/x18/person@3x.png 38 | images/white/x18/person@4x.png 39 | images/white/x48/person.png 40 | images/white/x48/person@2x.png 41 | images/white/x48/person@3x.png 42 | images/white/x48/person@4.png 43 | images/black/arrow_back.png 44 | images/black/arrow_back@2x.png 45 | images/black/arrow_back@3x.png 46 | images/black/arrow_back@4x.png 47 | images/black/directions.png 48 | images/black/directions@2x.png 49 | images/black/directions@3x.png 50 | images/black/directions@4x.png 51 | images/black/x18/arrow_back.png 52 | images/black/x18/arrow_back@2x.png 53 | images/black/x18/arrow_back@3x.png 54 | images/black/x18/arrow_back@4x.png 55 | images/black/x18/directions.png 56 | images/black/x18/directions@2x.png 57 | images/black/x18/directions@3x.png 58 | images/black/x18/directions@4x.png 59 | images/black/x36/arrow_back.png 60 | images/black/x36/arrow_back@2x.png 61 | images/black/x36/arrow_back@3x.png 62 | images/black/x36/arrow_back@4x.png 63 | images/black/x36/directions.png 64 | images/black/x36/directions@2x.png 65 | images/black/x36/directions@3x.png 66 | images/black/x36/directions@4x.png 67 | images/black/x48/arrow_back.png 68 | images/black/x48/arrow_back@2x.png 69 | images/black/x48/arrow_back@3x.png 70 | images/black/x48/arrow_back@4x.png 71 | images/black/x48/directions.png 72 | images/black/x48/directions@2x.png 73 | images/black/x48/directions@3x.png 74 | images/black/x48/directions@4.png 75 | images/white/arrow_back.png 76 | images/white/arrow_back@2x.png 77 | images/white/arrow_back@3x.png 78 | images/white/arrow_back@4x.png 79 | images/white/directions.png 80 | images/white/directions@2x.png 81 | images/white/directions@3x.png 82 | images/white/directions@4x.png 83 | images/white/x18/arrow_back.png 84 | images/white/x18/arrow_back@2x.png 85 | images/white/x18/arrow_back@3x.png 86 | images/white/x18/arrow_back@4x.png 87 | images/white/x18/directions.png 88 | images/white/x18/directions@2x.png 89 | images/white/x18/directions@3x.png 90 | images/white/x18/directions@4x.png 91 | images/white/x36/arrow_back.png 92 | images/white/x36/arrow_back@2x.png 93 | images/white/x36/arrow_back@3x.png 94 | images/white/x36/arrow_back@4x.png 95 | images/white/x36/directions.png 96 | images/white/x36/directions@2x.png 97 | images/white/x36/directions@3x.png 98 | images/white/x36/directions@4x.png 99 | images/white/x48/arrow_back.png 100 | images/white/x48/arrow_back@2x.png 101 | images/white/x48/arrow_back@3x.png 102 | images/white/x48/arrow_back@4.png 103 | images/white/x48/directions.png 104 | images/white/x48/directions@2x.png 105 | images/white/x48/directions@3x.png 106 | images/white/x48/directions@4x.png 107 | images/black/home.png 108 | images/black/home@2x.png 109 | images/black/home@3x.png 110 | images/black/home@4x.png 111 | images/black/x18/home.png 112 | images/black/x18/home@2x.png 113 | images/black/x18/home@3x.png 114 | images/black/x18/home@4x.png 115 | images/black/x36/home.png 116 | images/black/x36/home@2x.png 117 | images/black/x36/home@3x.png 118 | images/black/x36/home@4x.png 119 | images/black/x48/home.png 120 | images/black/x48/home@2x.png 121 | images/black/x48/home@3x.png 122 | images/black/x48/home@4x.png 123 | images/white/home.png 124 | images/white/home@2x.png 125 | images/white/home@3x.png 126 | images/white/home@4x.png 127 | images/white/x18/home.png 128 | images/white/x18/home@2x.png 129 | images/white/x18/home@3x.png 130 | images/white/x18/home@4x.png 131 | images/white/x36/home.png 132 | images/white/x36/home@2x.png 133 | images/white/x36/home@3x.png 134 | images/white/x36/home@4x.png 135 | images/white/x48/home.png 136 | images/white/x48/home@2x.png 137 | images/white/x48/home@3x.png 138 | images/white/x48/home@4x.png 139 | images/black/done.png 140 | images/black/done@2x.png 141 | images/black/done@3x.png 142 | images/black/done@4x.png 143 | images/black/x18/done.png 144 | images/black/x18/done@2x.png 145 | images/black/x18/done@3x.png 146 | images/black/x18/done@4x.png 147 | images/black/x36/done.png 148 | images/black/x36/done@2x.png 149 | images/black/x36/done@3x.png 150 | images/black/x36/done@4x.png 151 | images/black/x48/done.png 152 | images/black/x48/done@2x.png 153 | images/black/x48/done@3x.png 154 | images/black/x48/done@4x.png 155 | images/white/done.png 156 | images/white/done@2x.png 157 | images/white/done@3x.png 158 | images/white/done@4x.png 159 | images/white/x18/done.png 160 | images/white/x18/done@2x.png 161 | images/white/x18/done@3x.png 162 | images/white/x18/done@4x.png 163 | images/white/x36/done.png 164 | images/white/x36/done@2x.png 165 | images/white/x36/done@3x.png 166 | images/white/x36/done@4x.png 167 | images/white/x48/done.png 168 | images/white/x48/done@2x.png 169 | images/white/x48/done@3x.png 170 | images/white/x48/done@4x.png 171 | images/black/bus.png 172 | images/black/bus@2x.png 173 | images/black/bus@3x.png 174 | images/black/bus@4x.png 175 | images/black/car.png 176 | images/black/car@2x.png 177 | images/black/car@3x.png 178 | images/black/car@4x.png 179 | images/black/flight.png 180 | images/black/flight@2x.png 181 | images/black/flight@3x.png 182 | images/black/flight@4x.png 183 | images/black/settings.png 184 | images/black/settings@2x.png 185 | images/black/settings@3x.png 186 | images/black/settings@4x.png 187 | images/black/subway.png 188 | images/black/subway@2x.png 189 | images/black/subway@3x.png 190 | images/black/subway@4x.png 191 | images/black/truck.png 192 | images/black/truck@2x.png 193 | images/black/truck@3x.png 194 | images/black/truck@4x.png 195 | images/black/x18/bus.png 196 | images/black/x18/bus@2x.png 197 | images/black/x18/bus@3x.png 198 | images/black/x18/bus@4x.png 199 | images/black/x18/car.png 200 | images/black/x18/car@2x.png 201 | images/black/x18/car@3x.png 202 | images/black/x18/car@4x.png 203 | images/black/x18/flight.png 204 | images/black/x18/flight@2x.png 205 | images/black/x18/flight@3x.png 206 | images/black/x18/flight@4x.png 207 | images/black/x18/settings.png 208 | images/black/x18/settings@2x.png 209 | images/black/x18/settings@3x.png 210 | images/black/x18/settings@4x.png 211 | images/black/x18/subway.png 212 | images/black/x18/subway@2x.png 213 | images/black/x18/subway@3x.png 214 | images/black/x18/subway@4x.png 215 | images/black/x18/truck.png 216 | images/black/x18/truck@2x.png 217 | images/black/x18/truck@3x.png 218 | images/black/x18/truck@4x.png 219 | images/black/x36/bus.png 220 | images/black/x36/bus@2x.png 221 | images/black/x36/bus@3x.png 222 | images/black/x36/bus@4x.png 223 | images/black/x36/car.png 224 | images/black/x36/car@2x.png 225 | images/black/x36/car@3x.png 226 | images/black/x36/car@4x.png 227 | images/black/x36/flight.png 228 | images/black/x36/flight@2x.png 229 | images/black/x36/flight@3x.png 230 | images/black/x36/flight@4x.png 231 | images/black/x36/settings.png 232 | images/black/x36/settings@2x.png 233 | images/black/x36/settings@3x.png 234 | images/black/x36/settings@4x.png 235 | images/black/x36/subway.png 236 | images/black/x36/subway@2x.png 237 | images/black/x36/subway@3x.png 238 | images/black/x36/subway@4x.png 239 | images/black/x36/truck.png 240 | images/black/x36/truck@2x.png 241 | images/black/x36/truck@3x.png 242 | images/black/x36/truck@4x.png 243 | images/black/x48/bus.png 244 | images/black/x48/bus@2x.png 245 | images/black/x48/bus@3x.png 246 | images/black/x48/bus@4x.png 247 | images/black/x48/car.png 248 | images/black/x48/car@2x.png 249 | images/black/x48/car@3x.png 250 | images/black/x48/car@4x.png 251 | images/black/x48/flight.png 252 | images/black/x48/flight@2x.png 253 | images/black/x48/flight@3x.png 254 | images/black/x48/flight@4x.png 255 | images/black/x48/settings.png 256 | images/black/x48/settings@2x.png 257 | images/black/x48/settings@3x.png 258 | images/black/x48/settings@4x.png 259 | images/black/x48/subway.png 260 | images/black/x48/subway@2x.png 261 | images/black/x48/subway@3x.png 262 | images/black/x48/subway@4x.png 263 | images/black/x48/truck.png 264 | images/black/x48/truck@2x.png 265 | images/black/x48/truck@3x.png 266 | images/black/x48/truck@4x.png 267 | images/white/bus.png 268 | images/white/bus@2x.png 269 | images/white/bus@3x.png 270 | images/white/bus@4x.png 271 | images/white/car.png 272 | images/white/car@2x.png 273 | images/white/car@3x.png 274 | images/white/car@4x.png 275 | images/white/flight.png 276 | images/white/flight@2x.png 277 | images/white/flight@3x.png 278 | images/white/flight@4x.png 279 | images/white/settings.png 280 | images/white/settings@2x.png 281 | images/white/settings@3x.png 282 | images/white/settings@4x.png 283 | images/white/subway.png 284 | images/white/subway@2x.png 285 | images/white/subway@3x.png 286 | images/white/subway@4x.png 287 | images/white/truck.png 288 | images/white/truck@2x.png 289 | images/white/truck@3x.png 290 | images/white/truck@4x.png 291 | images/white/x18/bus.png 292 | images/white/x18/bus@2x.png 293 | images/white/x18/bus@3x.png 294 | images/white/x18/bus@4x.png 295 | images/white/x18/car.png 296 | images/white/x18/car@2x.png 297 | images/white/x18/car@3x.png 298 | images/white/x18/car@4x.png 299 | images/white/x18/flight.png 300 | images/white/x18/flight@2x.png 301 | images/white/x18/flight@3x.png 302 | images/white/x18/flight@4x.png 303 | images/white/x18/settings.png 304 | images/white/x18/settings@2x.png 305 | images/white/x18/settings@3x.png 306 | images/white/x18/settings@4x.png 307 | images/white/x18/subway.png 308 | images/white/x18/subway@2x.png 309 | images/white/x18/subway@3x.png 310 | images/white/x18/subway@4x.png 311 | images/white/x18/truck.png 312 | images/white/x18/truck@2x.png 313 | images/white/x18/truck@3x.png 314 | images/white/x18/truck@4x.png 315 | images/white/x36/bus.png 316 | images/white/x36/bus@2x.png 317 | images/white/x36/bus@3x.png 318 | images/white/x36/bus@4x.png 319 | images/white/x36/car.png 320 | images/white/x36/car@2x.png 321 | images/white/x36/car@3x.png 322 | images/white/x36/car@4x.png 323 | images/white/x36/flight.png 324 | images/white/x36/flight@2x.png 325 | images/white/x36/flight@3x.png 326 | images/white/x36/flight@4x.png 327 | images/white/x36/settings.png 328 | images/white/x36/settings@2x.png 329 | images/white/x36/settings@3x.png 330 | images/white/x36/settings@4x.png 331 | images/white/x36/subway.png 332 | images/white/x36/subway@2x.png 333 | images/white/x36/subway@3x.png 334 | images/white/x36/subway@4x.png 335 | images/white/x36/truck.png 336 | images/white/x36/truck@2x.png 337 | images/white/x36/truck@3x.png 338 | images/white/x36/truck@4x.png 339 | images/white/x48/bus.png 340 | images/white/x48/bus@2x.png 341 | images/white/x48/bus@3x.png 342 | images/white/x48/bus@4x.png 343 | images/white/x48/car.png 344 | images/white/x48/car@2x.png 345 | images/white/x48/car@3x.png 346 | images/white/x48/car@4x.png 347 | images/white/x48/flight.png 348 | images/white/x48/flight@2x.png 349 | images/white/x48/flight@3x.png 350 | images/white/x48/flight@4x.png 351 | images/white/x48/settings.png 352 | images/white/x48/settings@2x.png 353 | images/white/x48/settings@3x.png 354 | images/white/x48/settings@4x.png 355 | images/white/x48/subway.png 356 | images/white/x48/subway@2x.png 357 | images/white/x48/subway@3x.png 358 | images/white/x48/subway@4x.png 359 | images/white/x48/truck.png 360 | images/white/x48/truck@2x.png 361 | images/white/x48/truck@3x.png 362 | images/white/x48/truck@4x.png 363 | 364 | 365 | --------------------------------------------------------------------------------