Embrace the Yaru Theme and Widgets for Flutter Applications

Published on by Flutter News Hub

Embrace the Yaru Theme and Widgets for Flutter Applications

The official Flutter Yaru Theme and Widgets Suite enables developers to create stunning desktop and web applications that seamlessly align with the aesthetic of the Gnome desktop in Ubuntu 22.04+. This comprehensive package consists of:

  • Feature-rich widgets that complement the Yaru theme
  • A cohesive theme for material.dart and repository widgets
  • An extensive icon set adhering to the Yaru design language

Widgets and Theme for a Unified Experience

The included widgets empower developers to craft applications that seamlessly integrate with the Yaru theme. These widgets extend and enhance the capabilities of material.dart, offering a consistent and cohesive user experience. The accompanying theme further harmonizes the application's appearance, ensuring a visually pleasing and unified interface.

Comprehensive Icon Set for Visual Consistency

The repository boasts a complete icon set meticulously designed to match the Yaru style. These icons provide a comprehensive library for representing various concepts and actions, ensuring consistency throughout your application's interface.

Live Demo and Installation

To experience the Yaru Theme and Widgets in action, visit the live demo at https://ubuntu.github.io/yaru.dart/.

For installation, follow these steps:

flutter pub add yaru

Contributing to the Project

We welcome contributions to the Yaru Theme and Widgets Suite. Here's how to get started:

1. Flutter and VS Code Setup:

Install Flutter and VS Code using the following commands:

sudo apt -y install git curl cmake meson make clang libgtk-3-dev pkg-config
mkdir -p ~/development
cd ~/development
git clone https://github.com/flutter/flutter.git -b stable
echo 'export PATH="$PATH:$HOME/development/flutter/bin"' >> ~/.bashrc
source ~/.bashrc

sudo snap install code --classic

2. Icon Font Generator Installation:

Install the icon_font_generator tool for icon editing and font building:

dart pub global activate -sgit https://github.com/Jupi007/icon_font_generator.git --git-ref yaru

3. Icon Modification and Build:

  • Edit SVG icons in the ./icons directory.
  • Run the build script to generate the icon font:
./build-icons.sh

Licensing Information

  • Theme and Widgets: Mozilla Public License Version 2.0
  • Icons: Creative Commons Attribution-ShareAlike 4.0 License
  • Scripts: GNU General Public License, version 3

Conclusion

The Yaru Theme and Widgets Suite for Flutter empowers developers to create visually appealing and cohesive applications that effortlessly blend with the Yaru theme. With its comprehensive set of widgets, theme, and icons, this package provides a robust foundation for building exceptional desktop and web experiences.

Flutter News Hub