egui_material3/lib.rs
1//! # egui-material3
2//!
3//! A comprehensive Material Design 3 component library for [egui](https://github.com/emilk/egui),
4//! providing a complete set of Material Design components with advanced theming support.
5//!
6//! ## Features
7//!
8//! - **Complete Material Design 3 Components**: Buttons, checkboxes, sliders, dialogs, data tables, and more
9//! - **Advanced Theming System**: Support for light/dark modes, contrast levels, and custom Material Design themes
10//! - **Build-time Theme Inclusion**: Automatically include theme JSON files at compile time for optimal performance
11//! - **Runtime Theme Loading**: Load and switch themes dynamically at runtime
12//! - **Material Design Icons**: Full support for Material Symbols with built-in icon font loading
13//! - **Responsive Design**: Components adapt to different screen sizes and orientations
14//!
15//! ## Quick Start
16//!
17//! Add this to your `Cargo.toml`:
18//! ```bash
19//! $ cargo add egui-material3
20//! ```
21//!
22//! ### Basic Usage
23//!
24//! ```rust,no_run
25//! use eframe::egui;
26//! use egui_material3::{
27//! MaterialButton, MaterialCheckbox, MaterialSlider,
28//! theme::{setup_google_fonts, setup_local_fonts, setup_local_theme,
29//! load_fonts, load_themes, update_window_background}
30//! };
31//!
32//! fn main() -> Result<(), eframe::Error> {
33//! let options = eframe::NativeOptions {
34//! viewport: egui::ViewportBuilder::default().with_inner_size([800.0, 600.0]),
35//! ..Default::default()
36//! };
37//!
38//! eframe::run_native(
39//! "Material Design App",
40//! options,
41//! Box::new(|cc| {
42//! // Setup Material Design fonts and themes
43//! setup_google_fonts(Some("Roboto"));
44//! setup_local_fonts(Some("resources/MaterialSymbolsOutlined.ttf"));
45//! setup_local_theme(None); // Use default theme
46//!
47//! // Load fonts and themes
48//! load_fonts(&cc.egui_ctx);
49//! load_themes();
50//!
51//! // Apply theme background
52//! update_window_background(&cc.egui_ctx);
53//!
54//! Ok(Box::<MyApp>::default())
55//! }),
56//! )
57//! }
58//!
59//! #[derive(Default)]
60//! struct MyApp {
61//! checked: bool,
62//! slider_value: f32,
63//! }
64//!
65//! impl eframe::App for MyApp {
66//! fn update(&mut self, ctx: &egui::Context, _frame: &mut eframe::Frame) {
67//! egui::CentralPanel::default().show(ctx, |ui| {
68//! ui.heading("Material Design Components");
69//!
70//! // Use Material Design components
71//! ui.add(MaterialButton::new("Click me"));
72//! ui.add(MaterialCheckbox::new(&mut self.checked, "Check me"));
73//! ui.add(MaterialSlider::new(&mut self.slider_value, 0.0..=100.0));
74//! });
75//! }
76//! }
77//! ```
78//!
79//! ## Theme System
80//!
81//! The theme system supports Material Design 3 with comprehensive theming capabilities:
82//!
83//! ### Build-time Theme Inclusion
84//!
85//! Themes can be automatically included at build time from JSON files:
86//!
87//! ```rust,no_run
88//! use egui_material3::theme::{setup_local_theme, load_themes};
89//!
90//! // Uses themes from resources/ and examples/ directories automatically
91//! setup_local_theme(None);
92//! load_themes();
93//! ```
94//!
95//! ### Runtime Theme Loading
96//!
97//! Load custom themes dynamically:
98//!
99//! ```rust,no_run
100//! use egui_material3::theme::{setup_local_theme, load_themes};
101//!
102//! // Load specific theme file
103//! setup_local_theme(Some("path/to/my-theme.json"));
104//! load_themes();
105//! ```
106//!
107//! ### Theme Modes and Contrast
108//!
109//! Support for multiple theme modes and contrast levels:
110//!
111//! ```rust,no_run
112//! use egui_material3::theme::{get_global_theme, update_window_background, ThemeMode, ContrastLevel};
113//!
114//! // Change theme mode at runtime
115//! if let Ok(mut theme) = get_global_theme().lock() {
116//! theme.theme_mode = ThemeMode::Dark;
117//! theme.contrast_level = ContrastLevel::High;
118//! }
119//! // Apply changes
120//! update_window_background(ctx);
121//! ```
122//!
123//! ## Available Components
124//!
125//! ### Basic Components
126//! - [`MaterialButton`] - Material Design buttons with multiple variants
127//! - [`MaterialCheckbox`] - Checkboxes following Material Design guidelines
128//! - [`MaterialSlider`] - Sliders with Material Design styling
129//! - [`MaterialSwitch`] - Toggle switches
130//! - [`MaterialRadio`] - Radio button groups
131//! - [`MaterialSelect`] - Dropdown selection components
132//!
133//! ### Advanced Components
134//! - [`MaterialChip`] - Filter and action chips
135//! - [`MaterialCard2`] - Material Design cards
136//! - [`MaterialDialog`] - Modal dialogs and alerts
137//! - [`MaterialFab`] - Floating Action Buttons
138//! - [`MaterialProgress`] - Progress indicators and loading states
139//! - [`MaterialDataTable`] - Data tables with sorting and selection
140//!
141//! ### Navigation Components
142//! - [`MaterialTabs`] - Tab navigation
143//! - [`MaterialDrawer`] - Navigation drawers
144//! - [`MaterialTopAppBar`] - App bars and toolbars
145//!
146//! ### Icons and Visual Elements
147//! - [`MaterialIcon`] - Material Design icons with font support
148//! - [`MaterialList`] - Lists following Material Design patterns
149//! - [`MaterialImageList`] - Image lists with online/offline support and smart caching
150//!
151//! ## Image Lists and OnDemand Feature
152//!
153//! The [`MaterialImageList`] component provides comprehensive image display capabilities:
154//!
155//! ```rust,no_run
156//! use egui_material3::image_list;
157//!
158//! // Local image files
159//! ui.add(image_list()
160//! .columns(3)
161//! .item_spacing(8.0)
162//! .items_from_paths(glob::glob("resources/*.png")?));
163//!
164//! // Online images (requires 'ondemand' feature)
165//! ui.add(image_list()
166//! .columns(4)
167//! .item_spacing(8.0)
168//! .items_from_urls(vec![
169//! "https://example.com/image1.jpg".to_string(),
170//! "https://example.com/image2.png".to_string(),
171//! ]));
172//!
173//! // Embedded images from byte arrays
174//! ui.add(image_list()
175//! .columns(2)
176//! .item_spacing(8.0)
177//! .items_from_bytes(vec![
178//! include_bytes!("image1.png").to_vec(),
179//! include_bytes!("image2.png").to_vec(),
180//! ]));
181//! ```
182//!
183//! ### OnDemand Feature
184//!
185//! Enable the `ondemand` feature for online image support:
186//!
187//! ```toml
188//! [dependencies]
189//! egui-material3 = { version = "0.0.6", features = ["ondemand"] }
190//! ```
191//!
192//! Key capabilities:
193//! - **Smart caching**: Downloaded images are cached locally with correct file extensions
194//! - **Format detection**: Automatically detects PNG, JPEG, GIF, and WebP formats
195//! - **Efficient loading**: Images are downloaded once and reused from cache
196//! - **Performance optimized**: UI repaints only when new images are available
197//! - **Error handling**: Graceful fallback with visual indicators for failed loads
198//!
199//! ## Examples
200//!
201//! The crate includes comprehensive examples:
202//!
203//! - `widget_gallery_example` - Showcase of all Material components with theme switching
204//! - `nobel_prizes_example` - Real-world data table implementation
205//! - `stories` - Individual component showcase windows for detailed exploration
206//! - `package` - Standalone example with bundled resources and themes
207//! - `ondemand` - Image list demonstration with online/offline images and smart caching
208//!
209//! Run examples with:
210//! ```bash
211//! cargo run --example widget_gallery_example
212//! cargo run --example nobel_prizes_example
213//! cargo run --example stories
214//!
215//! # OnDemand example with online image support
216//! cd examples/ondemand && cargo run
217//!
218//! # Package example runs independently with its own Cargo.toml
219//! cd examples/package && cargo run
220//! ```
221//!
222//! ## Material Design Resources
223//!
224//! - [Material Design 3](https://m3.material.io/)
225//! - [Material Theme Builder](https://m3.material.io/theme-builder)
226//! - [Material Design Icons](https://fonts.google.com/icons)
227//!
228//! This crate follows the Material Design 3 specifications and guidelines for consistent,
229//! accessible, and beautiful user interfaces.
230
231pub mod button;
232pub mod card2;
233pub mod checkbox;
234pub mod chips;
235pub mod datatable;
236pub mod dialog;
237pub mod drawer;
238pub mod fab;
239pub mod icon;
240pub mod iconbutton;
241pub mod material_symbol;
242pub mod noto_emoji;
243pub mod image_utils;
244pub mod imagelist;
245pub mod layoutgrid;
246pub mod list;
247pub mod menu;
248pub mod progress;
249pub mod radio;
250pub mod select;
251pub mod slider;
252pub mod snackbar;
253pub mod switch;
254pub mod tabs;
255pub mod theme;
256pub mod topappbar;
257
258pub use {
259 button::{MaterialButton, MaterialButtonVariant},
260 card2::{elevated_card2, filled_card2, outlined_card2, Card2Variant, MaterialCard2},
261 checkbox::{checkbox, MaterialCheckbox},
262 chips::{assist_chip, filter_chip, input_chip, suggestion_chip, ChipVariant, MaterialChip},
263 datatable::{
264 data_table, CellContent, ColumnWidth, DataTableCell, DataTableColumn, DataTableRow,
265 DataTableSource, DataTableState, DataTableTheme, HAlign, MaterialDataTable, RowAction,
266 SortDirection, VAlign,
267 },
268 dialog::{dialog, MaterialDialog},
269 drawer::{
270 dismissible_drawer, modal_drawer, permanent_drawer, standard_drawer, DrawerAlignment,
271 DrawerHeader, DrawerItem, DrawerSection, DrawerThemeData, DrawerVariant, MaterialDrawer,
272 },
273 egui::TextEdit, // Re-export egui's TextEdit
274 fab::{
275 fab_branded, fab_primary, fab_secondary, fab_surface, fab_tertiary, google_branded_icon,
276 FabSize, FabVariant, MaterialFab, SvgIcon, SvgPath,
277 },
278 icon::{icon, MaterialIcon},
279 iconbutton::{
280 icon_button_filled, icon_button_filled_tonal, icon_button_outlined, icon_button_standard,
281 icon_button_toggle, IconButtonVariant, MaterialIconButton,
282 },
283 imagelist::{
284 image_list, masonry_image_list, woven_image_list, ImageListItem, ImageListVariant,
285 MaterialImageList,
286 },
287 layoutgrid::{debug_layout_grid, layout_grid, GridTile, GridTileBar, MaterialLayoutGrid},
288 list::{list, list_item, ListItem, ListTileStyle, ListTileTitleAlignment, MaterialList, VisualDensity},
289 menu::{
290 menu, menu_item, Corner, FocusState, MaterialMenu, MenuBarThemeData,
291 MenuButtonThemeData, MenuItem, MenuStyle, MenuThemeData, Positioning,
292 },
293 progress::{circular_progress, linear_progress, MaterialProgress, ProgressVariant},
294 radio::{radio, radio_group, radio_list_tile, MaterialRadio, MaterialRadioGroup, RadioListTile, ListTileControlAffinity},
295 select::{select, MaterialSelect, SelectVariant, MenuAlignment},
296 slider::{slider, range_slider, MaterialSlider, MaterialRangeSlider, RangeValues, SliderInteraction, ThumbShape},
297 snackbar::{snackbar, snackbar_with_action, MaterialSnackbar, SnackbarPosition, SnackBarBehavior},
298 switch::{switch, MaterialSwitch},
299 tabs::{tabs_primary, tabs_secondary, MaterialTabs, TabVariant},
300 theme::{
301 get_global_color, get_global_theme, update_global_theme, ContrastLevel,
302 MaterialThemeContext, MaterialThemeFile, ThemeMode,
303 },
304 topappbar::{
305 center_aligned_top_app_bar, large_top_app_bar, medium_top_app_bar, top_app_bar,
306 MaterialTopAppBar, TopAppBarVariant,
307 },
308};