# Mixbox pour Dart/Flutter

Implémentation Dart de **Mixbox 2.0** - mélange de couleurs physiquement réaliste simulant le comportement des pigments réels. ## 🎨 Pourquoi Mixbox ? Le mélange RGB classique produit des couleurs ternes : - **Jaune + Bleu = Gris** ❌ (en RGB) - **Jaune + Bleu = Vert** ✅ (avec Mixbox) Mixbox simule le comportement physique des pigments pour des résultats naturels. ## 📦 Installation ### 1. Ajoutez les fichiers ``` lib/ mixbox/ mixbox.dart mixbox_loader.dart assets/ mixbox_lut.dat ``` ### 2. Dépendances dans `pubspec.yaml` ```yaml dependencies: flutter: sdk: flutter archive: ^3.4.0 flutter: assets: - assets/mixbox_lut.dat ``` ### 3. Téléchargez la LUT Le fichier `mixbox_lut.dat` doit être téléchargé depuis : - **Source officielle**: https://github.com/scrtwpns/mixbox - Placez-le dans `assets/mixbox_lut.dat` > ⚠️ **Important**: Sans la LUT, Mixbox ne fonctionnera pas correctement. ## 🚀 Utilisation ### Initialisation (une fois au démarrage) ```dart import 'mixbox_loader.dart'; void main() async { WidgetsFlutterBinding.ensureInitialized(); // Chargement de la LUT await MixboxLoader.initializeFromAsset('assets/mixbox_lut.dat'); runApp(MyApp()); } ``` ### Mélange simple (2 couleurs) ```dart import 'package:flutter/material.dart'; import 'mixbox.dart'; import 'mixbox_loader.dart'; // Extension pour faciliter l'usage avec Flutter Color final yellow = Color(0xFFFEEC00); final blue = Color(0xFF190059); final green = yellow.mixWith(blue, 0.5); // 50% de chaque ``` ### Mélange multi-couleurs (3+) ```dart final red = Color(0xFFFF2702); final yellow = Color(0xFFFCD300); final blue = Color(0xFF0D1B44); // Conversion en espace latent final z1 = Mixbox.rgbToLatent(red.toMixboxInt()); final z2 = Mixbox.rgbToLatent(yellow.toMixboxInt()); final z3 = Mixbox.rgbToLatent(blue.toMixboxInt()); // Mélange personnalisé final zMix = List.generate( Mixbox.latentSize, (i) => 0.4 * z1[i] + 0.3 * z2[i] + 0.3 * z3[i], ); final mixed = Color(Mixbox.latentToRgb(zMix)); ``` ### Gradient physiquement correct ```dart final gradient = List.generate( 10, (i) => yellow.mixWith(blue, i / 9.0), ); ``` ## 🎨 Couleurs Pigments Prédéfinies Utilisez ces couleurs pour des résultats réalistes : ```dart const cadmiumYellow = Color(0xFFFEEC00); // Jaune cadmium const hansaYellow = Color(0xFFFCD300); // Jaune Hansa const cadmiumOrange = Color(0xFFFF6900); // Orange cadmium const cadmiumRed = Color(0xFFFF2702); // Rouge cadmium const quinacridoneMagenta = Color(0xFF80022E); // Magenta quinacridone const cobaltViolet = Color(0xFF4E0042); // Violet cobalt const ultramarineBlue = Color(0xFF190059); // Bleu outremer const cobaltBlue = Color(0xFF002185); // Bleu cobalt const phthaloBlue = Color(0xFF0D1B44); // Bleu phthalo const phthaloGreen = Color(0xFF003C32); // Vert phthalo const permanentGreen = Color(0xFF076D16); // Vert permanent const sapGreen = Color(0xFF6B9404); // Vert sève const burntSienna = Color(0xFF7B4800); // Terre de Sienne brûlée ``` ## 📊 API Complète ### Méthodes principales ```dart // Mélange int (0xAARRGGBB) int Mixbox.lerp(int color1, int color2, double t) // Mélange liste [r, g, b] ou [r, g, b, a] (0-255) List Mixbox.lerpList(List color1, List color2, double t) // Mélange float [r, g, b] ou [r, g, b, a] (0.0-1.0) List Mixbox.lerpFloat(List color1, List color2, double t) // Mélange RGB linéaire (pour rendu 3D) List Mixbox.lerpLinearFloat(List color1, List color2, double t) ``` ### Conversions ```dart // RGB → Latent List Mixbox.rgbToLatent(int color) List Mixbox.floatRgbToLatent(double r, double g, double b) // Latent → RGB int Mixbox.latentToRgb(List latent) List Mixbox.latentToFloatRgb(List latent) ``` ## 🧪 Exemple Complet ```dart import 'package:flutter/material.dart'; import 'mixbox.dart'; import 'mixbox_loader.dart'; void main() async { WidgetsFlutterBinding.ensureInitialized(); await MixboxLoader.initializeFromAsset('assets/mixbox_lut.dat'); runApp(const MyApp()); } class MyApp extends StatefulWidget { const MyApp({super.key}); @override State createState() => _MyAppState(); } class _MyAppState extends State { double _mix = 0.5; final _yellow = const Color(0xFFFEEC00); final _blue = const Color(0xFF190059); @override Widget build(BuildContext context) { final mixed = _yellow.mixWith(_blue, _mix); return MaterialApp( home: Scaffold( appBar: AppBar(title: const Text('Mixbox Demo')), body: Column( children: [ Container(height: 200, color: mixed), Slider( value: _mix, onChanged: (v) => setState(() => _mix = v), ), ], ), ), ); } } ``` ## ⚙️ Configuration Avancée ### Sans la LUT (Tests uniquement) ```dart // Génère une approximation (NON recommandé en production) final testLut = MixboxLoader.generateTestLut(); Mixbox.initialize(testLut); ``` ### Espace Linéaire (Rendu 3D) Pour shaders/rendu 3D, utilisez l'espace linéaire : ```dart final color1Linear = [1.0, 0.5, 0.0]; // RGB linéaire final color2Linear = [0.0, 0.2, 1.0]; final mixed = Mixbox.lerpLinearFloat(color1Linear, color2Linear, 0.5); ``` ## 📝 Licence **Creative Commons Attribution-NonCommercial 4.0** - ✅ Usage non-commercial gratuit - ❌ Usage commercial nécessite une licence - Contact: mixbox@scrtwpns.com ## 🔗 Ressources - **Site officiel**: https://scrtwpns.com/mixbox - **Paper**: https://scrtwpns.com/mixbox.pdf - **GitHub**: https://github.com/scrtwpns/mixbox - **Démo interactive**: https://scrtwpns.com/mixbox/painter/ ## ❓ FAQ **Q: Pourquoi la LUT est nécessaire ?** R: Elle contient les données pré-calculées du modèle physique des pigments (64×64×64 = 262,144 valeurs). **Q: Puis-je utiliser sans la LUT ?** R: Non pour des résultats corrects. La fonction `generateTestLut()` est juste pour les tests rapides. **Q: Performances ?** R: Très rapide (~1μs par mélange). L'interpolation trilinéaire est optimisée. **Q: Différence avec HSV/HSL ?** R: HSV/HSL sont des transformations mathématiques. Mixbox simule la physique réelle des pigments. **Q: Ça marche pour l'animation ?** R: Oui ! Parfait pour les gradients, transitions, et animations fluides. ## 🎯 Cas d'Usage - 🎨 Applications de dessin/peinture - 🌈 Gradients naturels - 🎬 Outils de création de contenu - 🎮 Systèmes de couleurs dans les jeux - 🖼️ Filtres photo réalistes - 📊 Visualisations de données