| name | scrcpy-option-ui-builder |
| description | This skill should modify the category screens and add the requested scrcpy options to the UI, depending on the type of the option (text, toggle, dropdown, etc.). Use this skill for adding new scrcpy options in the UI. |
Scrcpy option UI builder
Working directory: /lib/presentation/scrcpy_config/
UI option screens are present in @lib/presentation/scrcpy_config.
Common, re-usable widgets are present in @lib/presentation/scrcpy_config/widgets.
Steps
- Gather information
- Extend or create UI code in the
<category_screen>.dartfile - Create necessary translations for the the UI Control
1. Gather information
- Refer to /docs/scrcpy_options to find information about the scrcpy option (Argument, name, description, is advanced).
- Find the corresponding argument class in /lib/application/model/scrcpy/arguments/
- If the argument class doesn't exist, first create it using this skill
- Use this argument class in the UI code to get existing value and to update it.
2. Create <category_screen>.dart
- Refer to /lib/presentation/scrcpy_config/video_screen.dart
- Create a similar scrollable screen with necessary dependencies for the new category screen.
- Create a new route inside routes.dart
- Introduce new
NavigationPaneIteminside home_screen.dart using the new route - Follow the next section to extend the screen code with UI controls.
2. Extend existing UI Code
- If the
<category_screen>.dartfile for requested scrcpy option and the respective category already exists, then extend the ScrollableColumn, with the new control(s)
Use /lib/presentation/scrcpy_config/widgets/config_item.dart for wrapping the actual UI control.
- The
ConfigItemwidget expects:
label(key and translation label) to show title, description and argument tooltip.childthe actual control widget (toggle/switch/text input/comboBox/etc.)
- Use `ConfigTextBox` for text input controls
3. Create translations
- Currently, the project only supports english language.
- The translation file is present here
- Refer to the existing translations under this path inside the JSON: e.g.
confg/video/noVideo - Expected path:
config/<category>/<argument.label> - Required translations:
title,description,arg - Optional:
default(default value for the control e.g. for comboBox)