master #81
@ -16,54 +16,60 @@
|
|||||||
* along with this program. If not, see <https://www.gnu.org/licenses/>.
|
* along with this program. If not, see <https://www.gnu.org/licenses/>.
|
||||||
-->
|
-->
|
||||||
|
|
||||||
# Flutter - Wyatt Ui Kit
|
# Wyatt UI Kit
|
||||||
|
|
||||||
<p align="left">
|
<p align="left">
|
||||||
<a href="https://git.wyatt-studio.fr/Wyatt-FOSS/wyatt-packages/src/branch/master/packages/wyatt_analysis"><img src="https://img.shields.io/badge/Style-Wyatt%20Analysis-blue.svg?style=flat-square" alt="Style: Wyatt Analysis" /></a>
|
<a href="https://git.wyatt-studio.fr/Wyatt-FOSS/wyatt-packages/src/branch/master/packages/wyatt_analysis"><img src="https://img.shields.io/badge/Style-Wyatt%20Analysis-blue.svg?style=flat-square" alt="Style: Wyatt Analysis" /></a>
|
||||||
<img src="https://img.shields.io/badge/SDK-Flutter-blue?style=flat-square" alt="SDK: Flutter" />
|
<img src="https://img.shields.io/badge/SDK-Flutter-blue?style=flat-square" alt="SDK: Flutter" />
|
||||||
</p>
|
</p>
|
||||||
|
|
||||||
UIKit and Design System used in Wyatt Studio.
|
UIKit and Design System used in Wyatt Studio. This is a implementation of the components defined in [Wyatt UI Components](https://git.wyatt-studio.fr/Wyatt-FOSS/wyatt-packages/src/branch/master/packages/wyatt_ui_components) package.
|
||||||
|
|
||||||
## Theme negotiation
|
|
||||||
|
|
||||||
When building a component, most of its attributes can be 'null'.
|
|
||||||
The `build()` method then starts to negotiate the theme in the tree to obtain the most consistent style possible.
|
|
||||||
|
|
||||||
Explanation:
|
|
||||||
|
|
||||||
When you build a component `Button({double? radius})`.
|
|
||||||
You have several possibilities:
|
|
||||||
1) Pass the "radius" into the constructor, `Button(radius: 12)`.
|
|
||||||
2) Set up a theme extension `ButtonThemeExtension(radius: 15)`.
|
|
||||||
3) Let `wyatt_ui_kit` "negotiate" and try to find a suitable style in the flutter theme.
|
|
||||||
|
|
||||||
If this negotiation phase fails, then:
|
|
||||||
- If the value is mandatory: a hardcoded value in "wyatt_ui_kit" is chosen.
|
|
||||||
- If not, the style is simply not applied.
|
|
||||||
|
|
||||||
If, for example, you don't use option 1, then the radius will be 15. If you use neither option 1 nor option 2 then the radius will be 4 as this is the [official Material Design value](https://m2.material.io/design/shape/about-shape.html#shape-customization-tool).
|
|
||||||
|
|
||||||
## Features
|
|
||||||
|
|
||||||
TODO: List what your package can do. Maybe include images, gifs, or videos.
|
|
||||||
|
|
||||||
## Getting started
|
|
||||||
|
|
||||||
TODO: List prerequisites and provide or point to information on how to
|
|
||||||
start using the package.
|
|
||||||
|
|
||||||
## Usage
|
## Usage
|
||||||
|
|
||||||
TODO: Include short and useful examples for package users. Add longer examples
|
The UIKit provides `WyattComponentThemeData` class that contains all the components used in Wyatt Studio. You can use it in your app by calling `WyattComponentTheme` widget and give your app as child. For example :
|
||||||
to `/example` folder.
|
|
||||||
|
This component theme is to be used with Wyatt UI Components. It provides a default theme for all the components defined in Wyatt UI Components package.
|
||||||
|
|
||||||
```dart
|
```dart
|
||||||
const like = 'sample';
|
void main() {
|
||||||
|
runApp(const MyApp());
|
||||||
|
}
|
||||||
|
|
||||||
|
class MyApp extends StatelessWidget {
|
||||||
|
const MyApp({super.key});
|
||||||
|
|
||||||
|
@override
|
||||||
|
Widget build(BuildContext context) => ComponentTheme(
|
||||||
|
// It is here that you can override the default theme !
|
||||||
|
componentThemeWidget: WyattComponentThemeData(),
|
||||||
|
child: MaterialApp(
|
||||||
|
title: 'Wyatt Ui Layout Example',
|
||||||
|
theme: ThemeData(
|
||||||
|
primarySwatch: Colors.blue,
|
||||||
|
),
|
||||||
|
home: const ..,
|
||||||
|
),
|
||||||
|
);
|
||||||
|
}
|
||||||
```
|
```
|
||||||
|
|
||||||
## Additional information
|
## Development
|
||||||
|
|
||||||
TODO: Tell users more about the package: where to find more information, how to
|
> Common to this, and Wyatt UI Components packages.
|
||||||
contribute to the package, how to file issues, what response they can expect
|
|
||||||
from the package authors, and more.
|
Add a new component :
|
||||||
|
|
||||||
|
**Wyatt UI Components side**
|
||||||
|
|
||||||
|
1. Create a new file in `lib/src/domain/entities` folder.
|
||||||
|
2. Add your component class.
|
||||||
|
3. Add your component class to `ComponentThemeData` abstract class.
|
||||||
|
4. Run `flutter pub run build_runner build` to generate your component proxy properties.
|
||||||
|
|
||||||
|
**Wyatt UI Kit side**
|
||||||
|
1. Create a new file in `lib/src/components` folder.
|
||||||
|
2. Add your component class, styles, (and logic if needed)
|
||||||
|
3. Run `flutter pub run build_runner build` to generate your component copy with method.
|
||||||
|
4. Add a theme extension to your component class in `lib/src/domain/`
|
||||||
|
5. Add your component class `wyattComponentThemeData` static property in `lib/src/features/wyatt_component_theme_data.dart`
|
||||||
|
@ -3,7 +3,7 @@ description: UIKit and Design System used in Wyatt Studio.
|
|||||||
repository: https://git.wyatt-studio.fr/Wyatt-FOSS/wyatt-packages/src/branch/master/packages/wyatt_ui_kit
|
repository: https://git.wyatt-studio.fr/Wyatt-FOSS/wyatt-packages/src/branch/master/packages/wyatt_ui_kit
|
||||||
version: 1.0.0
|
version: 1.0.0
|
||||||
|
|
||||||
publish_to: none
|
publish_to: https://git.wyatt-studio.fr/api/packages/Wyatt-FOSS/pub
|
||||||
|
|
||||||
environment:
|
environment:
|
||||||
sdk: ">=2.19.0 <3.0.0"
|
sdk: ">=2.19.0 <3.0.0"
|
||||||
@ -22,13 +22,11 @@ dependencies:
|
|||||||
name: wyatt_bloc_helper
|
name: wyatt_bloc_helper
|
||||||
version: 2.0.0
|
version: 2.0.0
|
||||||
wyatt_component_copy_with_extension:
|
wyatt_component_copy_with_extension:
|
||||||
git:
|
hosted: https://git.wyatt-studio.fr/api/packages/Wyatt-FOSS/pub
|
||||||
url: ssh://git@git.wyatt-studio.fr:993/Wyatt-FOSS/wyatt-packages.git
|
version: ^1.0.0
|
||||||
path: packages/wyatt_component_copy_with_extension
|
|
||||||
wyatt_ui_components:
|
wyatt_ui_components:
|
||||||
git:
|
hosted: https://git.wyatt-studio.fr/api/packages/Wyatt-FOSS/pub
|
||||||
url: ssh://git@git.wyatt-studio.fr:993/Wyatt-FOSS/wyatt-packages.git
|
version: ^0.0.1
|
||||||
path: packages/wyatt_ui_components
|
|
||||||
|
|
||||||
dev_dependencies:
|
dev_dependencies:
|
||||||
build_runner: ^2.3.3
|
build_runner: ^2.3.3
|
||||||
@ -37,10 +35,5 @@ dev_dependencies:
|
|||||||
hosted: https://git.wyatt-studio.fr/api/packages/Wyatt-FOSS/pub
|
hosted: https://git.wyatt-studio.fr/api/packages/Wyatt-FOSS/pub
|
||||||
version: ^2.4.1
|
version: ^2.4.1
|
||||||
wyatt_component_copy_with_gen:
|
wyatt_component_copy_with_gen:
|
||||||
git:
|
hosted: https://git.wyatt-studio.fr/api/packages/Wyatt-FOSS/pub
|
||||||
url: ssh://git@git.wyatt-studio.fr:993/Wyatt-FOSS/wyatt-packages.git
|
version: ^1.0.0
|
||||||
path: packages/wyatt_component_copy_with_gen
|
|
||||||
|
|
||||||
# The following section is specific to Flutter.
|
|
||||||
flutter:
|
|
||||||
uses-material-design: true
|
|
||||||
|
Loading…
x
Reference in New Issue
Block a user