# UI Component Gallery

The showcase of the Aurora OS UI components. Both Silica demos and best practices for more complex custom components.

Build status:
* example - [![pipeline status](https://gitlab.com/omprussia/demos/UiComponentGallery/badges/example/pipeline.svg)](https://gitlab.com/omprussia/demos/UiComponentGallery/-/commits/example)
* dev - [![pipeline status](https://gitlab.com/omprussia/demos/UiComponentGallery/badges/dev/pipeline.svg)](https://gitlab.com/omprussia/demos/UiComponentGallery/-/commits/dev)

### Components

**Controls**

Buttons
[ButtonPage.qml](qml/pages/ButtonPage.qml)

List box
[ComboBoxPage.qml](qml/pages/ComboBoxPage.qml)

List and menu
[ListPage.qml](qml/pages/ListPage.qml)

Grid and menu
[GridPage.qml](qml/pages/GridPage.qml)

Slider
[SliderPage.qml](qml/pages/SliderPage.qml)

Progress Indicators
[ProgressPage.qml](qml/pages/ProgressPage.qml)

Notifications in the application
[NoticePage.qml](qml/pages/NoticePage.qml)

Popup menu
[PopupMenuPage.qml](qml/pages/PopupMenuPage.qml)

AppBar
[AppBarPage.qml](qml/pages/AppBarPage.qml)

**Text**

Formatting
[FormatterPage.qml](qml/pages/FormatterPage.qml)

Labels
[LabelPage.qml](qml/pages/LabelPage.qml)

Text Input
[TextInputPage.qml](qml/pages/TextInputPage.qml)

Sign in to an account
[SignInDialog.qml](qml/pages/SignInDialog.qml)

Example form
[FormDialog.qml](qml/pages/FormDialog.qml)

**View**

CoverPage
[CoverPage.qml](qml/pages/CoverPage.qml)

SampleCoverPage
[SampleCoverPage.qml](qml/pages/SampleCoverPage.qml)

Dialogs
[DialogPage.qml](qml/pages/DialogPage.qml)

Orientation
[OrientationPage.qml](qml/pages/OrientationPage.qml)

Page Stack
[PageStackPage.qml](qml/pages/PageStackPage.qml)

Touch Hints
[InteractionHintPage.qml](qml/pages/InteractionHintPage.qml)

Split view
[SplitViewPage.qml](qml/pages/SplitViewPage.qml)

Panels and sections
[PanelPage.qml](qml/pages/PanelPage.qml)

WebView
[WebViewPage.qml](qml/pages/WebViewPage.qml)

**Styling and Effects**

Effects
[EffectPage.qml](qml/pages/EffectPage.qml)

Haptic Link
[HapticPage.qml](qml/pages/HapticPage.qml)

Smoothly fade into transparency
[OpacityRampPage.qml](qml/pages/OpacityRampPage.qml)

Font
[FontPage.qml](qml/pages/FontPage.qml)

Palette
[PalettePage.qml](qml/pages/PalettePage.qml)

**Example**

Search
[SearchPage.qml](qml/pages/SearchPage.qml)

Screen Cuts: Debug Page
[CutoutDebugPage.qml](qml/pages/CutoutDebugPage.qml)

Forms: declarative switches
[DeclarativeRadioButtonsPage.qml](qml/pages/DeclarativeRadioButtonsPage.qml)

Forms: radio buttons with model
[RadioButtonsModelPage.qml](qml/pages/RadioButtonsModelPage.qml)

ListView with ticker
[ListViewWithRunningLinePage.qml](qml/pages/ListViewWithRunningLinePage.qml)

## Terms of Use and Participation

The source code of the project is provided under [the license](LICENSE.BSD-3-Clause.md),
which allows its use in third-party applications.

The [contributor agreement](CONTRIBUTING.md) documents the rights granted by contributors
of the Open Mobile Platform.

Information about the contributors is specified in the [AUTHORS](AUTHORS.md) file.

[Code of conduct](CODE_OF_CONDUCT.md) is a current set of rules of the Open Mobile
Platform which informs you how we expect the members of the community will interact
while contributing and communicating.

## Project Structure

The project has a standard standard of an application based on C++ and QML for Aurora OS.

* **[ru.auroraos.UiComponentGallery.pro](ru.auroraos.UiComponentGallery.pro)** file describes the project structure for the qmake build system.
* **[icons](icons)** directory contains the application icons for different screen resolutions.
* **[qml](qml)** directory contains the QML source code and the UI resources.
  * **[components](qml/components)** directory contains the custom QML components.
  * **[cover](qml/cover)** directory contains the application cover implementations.
  * **[icons](qml/icons)** directory contains the additional custom UI icons.
  * **[pages](qml/pages)** directory contains the application pages.
  * **[UiComponentGallery.qml](qml/UiComponentGallery.qml)** file provides the application window implementation.
* **[rpm](rpm)** directory contains the rpm-package build settings.
  * **[ru.auroraos.UiComponentGallery.spec](rpm/ru.auroraos.UiComponentGallery.spec)** file is used by rpmbuild tool.
* **[src](src)** directory contains the C++ source code.
  * **[main.cpp](src/main.cpp)** file is the application entry point.
  * **[selectgroupmodel.h](src/selectgroupmodel.h)** file contains the declaration of the selectgroup model.
  * **[selectgroupmodel.cpp](src/selectgroupmodel.cpp)** file contains the definition of the selectgroup model.
* **[translations](translations)** directory contains the UI translation files.
* **[ru.auroraos.UiComponentGallery.desktop](ru.auroraos.UiComponentGallery.desktop)** file defines the display and parameters for launching the application.
  
## Compatibility

The project is compatible with all the current versions of the Aurora OS.

## UI Tests

This project is used as an example of automated UI testing with [qtium-driver](https://developer.auroraos.ru/doc/5.1.5/software_development/guides/application_testing/qtium_driver). 
For more details, see [UiComponentGalleryTestExample](https://gitlab.com/omprussia/testing/UiComponentGalleryTestExample) project.

## Screenshots

![screenshots](screenshots/screenshots.png)

## This document in Russian / Перевод этого документа на русский язык

- [README.ru.md](README.ru.md)
