[{"data":1,"prerenderedAt":9780},["ShallowReactive",2],{"navigation_docs":3,"-csharp-desktop-ui-39a-avalonia-animations":2949,"-csharp-desktop-ui-39a-avalonia-animations-surround":9775},[4,1640,1765,2219,2352,2559,2641,2691,2748,2782,2908,2945],{"title":5,"icon":6,"path":7,"stem":8,"children":9},"C#","i-devicon-csharp","/csharp","01.csharp",[10,13,60,90,120,202,219,253,379,404,457,650,1346,1636],{"title":11,"path":7,"stem":12},"C# Roadmap","01.csharp/index",{"title":14,"icon":15,"path":16,"stem":17,"children":18,"page":59},"Fundamentals","i-lucide-book-open","/csharp/fundamentals","01.csharp/01.fundamentals",[19,23,27,31,35,39,43,47,51,55],{"title":20,"path":21,"stem":22},"Вступ до екосистеми .NET","/csharp/fundamentals/introduction-to-ecosystem","01.csharp/01.fundamentals/01.introduction-to-ecosystem",{"title":24,"path":25,"stem":26},"Структура програми на C#","/csharp/fundamentals/program-structure","01.csharp/01.fundamentals/02.program-structure",{"title":28,"path":29,"stem":30},"Змінні та Типи Даних","/csharp/fundamentals/variables-data-types","01.csharp/01.fundamentals/03.variables-data-types",{"title":32,"path":33,"stem":34},"Масиви","/csharp/fundamentals/arrays","01.csharp/01.fundamentals/04.arrays",{"title":36,"path":37,"stem":38},"Strings & Text Handling","/csharp/fundamentals/strings-text-handling","01.csharp/01.fundamentals/05.strings-text-handling",{"title":40,"path":41,"stem":42},"Дати і Час","/csharp/fundamentals/dates-time-handling","01.csharp/01.fundamentals/06.dates-time-handling",{"title":44,"path":45,"stem":46},"Потік Керування","/csharp/fundamentals/control-flow","01.csharp/01.fundamentals/07.control-flow",{"title":48,"path":49,"stem":50},"Методи","/csharp/fundamentals/methods","01.csharp/01.fundamentals/08.methods",{"title":52,"path":53,"stem":54},"Основи Відлагодження","/csharp/fundamentals/debugging-basics","01.csharp/01.fundamentals/09.debugging-basics",{"title":56,"path":57,"stem":58},"Інтерактивна Консоль (Classic)","/csharp/fundamentals/interactive-console","01.csharp/01.fundamentals/10.interactive-console",false,{"title":61,"icon":62,"path":63,"stem":64,"children":65,"page":59},"OOP","i-lucide-box","/csharp/oop","01.csharp/02.oop",[66,70,74,78,82,86],{"title":67,"path":68,"stem":69},"Package Management (Управління Пакетами)","/csharp/oop/package-management","01.csharp/02.oop/01.package-management",{"title":71,"path":72,"stem":73},"Класи та Об'єкти","/csharp/oop/classes-objects","01.csharp/02.oop/02.classes-objects",{"title":75,"path":76,"stem":77},"Властивості та Поля","/csharp/oop/properties-fields","01.csharp/02.oop/03.properties-fields",{"title":79,"path":80,"stem":81},"Стовпи ООП","/csharp/oop/oop-pillars","01.csharp/02.oop/04.oop-pillars",{"title":83,"path":84,"stem":85},"Advanced Types","/csharp/oop/advanced-types","01.csharp/02.oop/05.advanced-types",{"title":87,"path":88,"stem":89},"Namespaces (Простори Імен)","/csharp/oop/namespaces","01.csharp/02.oop/06.namespaces",{"title":91,"icon":92,"path":93,"stem":94,"children":95,"page":59},"Advanced Core","i-lucide-zap","/csharp/advanced-core","01.csharp/03.advanced-core",[96,100,104,108,112,116],{"title":97,"path":98,"stem":99},"Generics (Узагальнення)","/csharp/advanced-core/generics","01.csharp/03.advanced-core/01.generics",{"title":101,"path":102,"stem":103},"Делегати, Події та Лямбда-вирази","/csharp/advanced-core/delegates-events-lambdas","01.csharp/03.advanced-core/02.delegates-events-lambdas",{"title":105,"path":106,"stem":107},"Interfaces Deep Dive (Інтерфейси: Поглиблений Розгляд)","/csharp/advanced-core/interfaces-deep-dive","01.csharp/03.advanced-core/03.interfaces-deep-dive",{"title":109,"path":110,"stem":111},"Обробка Винятків","/csharp/advanced-core/exception-handling","01.csharp/03.advanced-core/04.exception-handling",{"title":113,"path":114,"stem":115},"Pattern Matching","/csharp/advanced-core/pattern-matching","01.csharp/03.advanced-core/05.pattern-matching",{"title":117,"path":118,"stem":119},"Додаткові Можливості C#","/csharp/advanced-core/additional-features","01.csharp/03.advanced-core/06.additional-features",{"title":121,"icon":122,"path":123,"stem":124,"children":125,"page":59},"Architecture Best Practices","i-lucide-building-2","/csharp/architecture-best-practices","01.csharp/04.architecture-best-practices",[126,130,149,153,157,161,165,169],{"title":127,"path":128,"stem":129},"Software Design Principles (Частина 1)","/csharp/architecture-best-practices/software-design-principles","01.csharp/04.architecture-best-practices/01.software-design-principles",{"title":131,"icon":132,"path":133,"stem":134,"children":135,"page":59},"Design Patterns","i-lucide-folder","/csharp/architecture-best-practices/design-patterns","01.csharp/04.architecture-best-practices/02.design-patterns",[136],{"title":137,"icon":132,"path":138,"stem":139,"children":140,"page":59},"Creational","/csharp/architecture-best-practices/design-patterns/creational","01.csharp/04.architecture-best-practices/02.design-patterns/creational",[141,145],{"title":142,"path":143,"stem":144},"Singleton (Одинак)","/csharp/architecture-best-practices/design-patterns/creational/singleton","01.csharp/04.architecture-best-practices/02.design-patterns/creational/01.singleton",{"title":146,"path":147,"stem":148},"Builder (Будівельник)","/csharp/architecture-best-practices/design-patterns/creational/builder","01.csharp/04.architecture-best-practices/02.design-patterns/creational/02.builder",{"title":150,"path":151,"stem":152},"Building Professional CLIs","/csharp/architecture-best-practices/building-professional-clis","01.csharp/04.architecture-best-practices/03.building-professional-clis",{"title":154,"path":155,"stem":156},"Validation & Flow Control","/csharp/architecture-best-practices/validation-flow-control","01.csharp/04.architecture-best-practices/04.validation-flow-control",{"title":158,"path":159,"stem":160},"The Modern .NET Host (Microsoft.Extensions)","/csharp/architecture-best-practices/modern-dotnet-host","01.csharp/04.architecture-best-practices/05.modern-dotnet-host",{"title":162,"path":163,"stem":164},"Data Mapper: Repository та DAO патерни (Частина 1)","/csharp/architecture-best-practices/data-mapper-part1","01.csharp/04.architecture-best-practices/06.data-mapper-part1",{"title":166,"path":167,"stem":168},"Data Mapper: Repository та DAO патерни (Частина 2)","/csharp/architecture-best-practices/data-mapper-part2","01.csharp/04.architecture-best-practices/07.data-mapper-part2",{"title":170,"icon":132,"path":171,"stem":172,"children":173,"page":59},"Di Ioc","/csharp/architecture-best-practices/di-ioc","01.csharp/04.architecture-best-practices/08.di-ioc",[174,178,182,186,190,194,198],{"title":175,"path":176,"stem":177},"Проблема залежностей та Інверсія Контролю","/csharp/architecture-best-practices/di-ioc/the-dependency-problem","01.csharp/04.architecture-best-practices/08.di-ioc/01.the-dependency-problem",{"title":179,"path":180,"stem":181},"Будуємо власний Service Container","/csharp/architecture-best-practices/di-ioc/build-your-own-container","01.csharp/04.architecture-best-practices/08.di-ioc/02.build-your-own-container",{"title":183,"path":184,"stem":185},"Service Locator: Паттерн та Анти-паттерн","/csharp/architecture-best-practices/di-ioc/service-locator-pattern","01.csharp/04.architecture-best-practices/08.di-ioc/03.service-locator-pattern",{"title":187,"path":188,"stem":189},"Паттерни Dependency Injection","/csharp/architecture-best-practices/di-ioc/dependency-injection-patterns","01.csharp/04.architecture-best-practices/08.di-ioc/04.dependency-injection-patterns",{"title":191,"path":192,"stem":193},"Microsoft DI: IServiceCollection та IServiceProvider","/csharp/architecture-best-practices/di-ioc/microsoft-di-deep-dive","01.csharp/04.architecture-best-practices/08.di-ioc/05.microsoft-di-deep-dive",{"title":195,"path":196,"stem":197},"Service Lifetimes та Scopes","/csharp/architecture-best-practices/di-ioc/service-lifetimes-and-scopes","01.csharp/04.architecture-best-practices/08.di-ioc/06.service-lifetimes-and-scopes",{"title":199,"path":200,"stem":201},"DI Анти-паттерни та Найкращі Практики","/csharp/architecture-best-practices/di-ioc/di-anti-patterns-and-best-practices","01.csharp/04.architecture-best-practices/08.di-ioc/07.di-anti-patterns-and-best-practices",{"title":203,"icon":132,"path":204,"stem":205,"children":206,"page":59},"Standard Library","/csharp/standard-library","01.csharp/05.standard-library",[207,211,215],{"title":208,"path":209,"stem":210},"Collections (Колекції)","/csharp/standard-library/collections","01.csharp/05.standard-library/01.collections",{"title":212,"path":213,"stem":214},"High Performance Types (Високопродуктивні Типи)","/csharp/standard-library/high-performance-types","01.csharp/05.standard-library/02.high-performance-types",{"title":216,"path":217,"stem":218},"LINQ (Language Integrated Query)","/csharp/standard-library/linq","01.csharp/05.standard-library/03.linq",{"title":220,"icon":221,"path":222,"stem":223,"children":224,"page":59},"System Internals Concurrency","i-lucide-server","/csharp/system-internals-concurrency","01.csharp/06.system-internals-concurrency",[225,229,233,237,241,245,249],{"title":226,"path":227,"stem":228},"Memory Management","/csharp/system-internals-concurrency/memory-management","01.csharp/06.system-internals-concurrency/01.memory-management",{"title":230,"path":231,"stem":232},"Reflection API: System.Type та Метадані","/csharp/system-internals-concurrency/reflection-fundamentals","01.csharp/06.system-internals-concurrency/02.reflection-fundamentals",{"title":234,"path":235,"stem":236},"Attributes та Dynamic Language Runtime","/csharp/system-internals-concurrency/attributes-dynamic","01.csharp/06.system-internals-concurrency/03.attributes-dynamic",{"title":238,"path":239,"stem":240},"Expression Trees: Швидка Альтернатива Рефлексії","/csharp/system-internals-concurrency/expression-trees-compiled","01.csharp/06.system-internals-concurrency/04.expression-trees-compiled",{"title":242,"path":243,"stem":244},"Source Generators: Compile-Time Code Generation","/csharp/system-internals-concurrency/source-generators","01.csharp/06.system-internals-concurrency/05.source-generators",{"title":246,"path":247,"stem":248},"Multithreading Fundamentals","/csharp/system-internals-concurrency/multithreading-fundamentals","01.csharp/06.system-internals-concurrency/06.multithreading-fundamentals",{"title":250,"path":251,"stem":252},"Synchronization Primitives","/csharp/system-internals-concurrency/synchronization-primitives","01.csharp/06.system-internals-concurrency/07.synchronization-primitives",{"title":254,"icon":255,"path":256,"stem":257,"children":258,"page":59},"System Programming Windows","i-lucide-cpu","/csharp/system-programming-windows","01.csharp/07.system-programming-windows",[259,263,267,271,275,279,283,287,291,295,299,303,307,311,315,319,323,327,331,335,339,343,347,351,355,359,363,367,371,375],{"title":260,"path":261,"stem":262},"Як Працює Операційна Система","/csharp/system-programming-windows/how-os-works","01.csharp/07.system-programming-windows/01.how-os-works",{"title":264,"path":265,"stem":266},"Процеси в .NET — API та Запуск","/csharp/system-programming-windows/processes-in-dotnet","01.csharp/07.system-programming-windows/02.processes-in-dotnet",{"title":268,"path":269,"stem":270},"Процеси в .NET — IPC та Міжпроцесна Комунікація","/csharp/system-programming-windows/02a.processes-ipc","01.csharp/07.system-programming-windows/02a.processes-ipc",{"title":272,"path":273,"stem":274},"Application Domains та Збірки — AppDomain і AssemblyLoadContext","/csharp/system-programming-windows/appdomains-assemblies","01.csharp/07.system-programming-windows/03.appdomains-assemblies",{"title":276,"path":277,"stem":278},"Application Domains та Збірки — Plug-in Система з Hot-Reload","/csharp/system-programming-windows/03a.appdomains-plugin-system","01.csharp/07.system-programming-windows/03a.appdomains-plugin-system",{"title":280,"path":281,"stem":282},"Потоки — Основи та API Thread","/csharp/system-programming-windows/thread-fundamentals","01.csharp/07.system-programming-windows/04.thread-fundamentals",{"title":284,"path":285,"stem":286},"Потоки — Lifecycle, Пріоритети та Безпечне Завершення","/csharp/system-programming-windows/04a.thread-lifecycle-priorities","01.csharp/07.system-programming-windows/04a.thread-lifecycle-priorities",{"title":288,"path":289,"stem":290},"Проблеми Спільного Стану — Race Condition та Data Race","/csharp/system-programming-windows/shared-state-problems","01.csharp/07.system-programming-windows/05.shared-state-problems",{"title":292,"path":293,"stem":294},"Проблеми Спільного Стану — Memory Model та volatile","/csharp/system-programming-windows/05a.shared-state-memory-model","01.csharp/07.system-programming-windows/05a.shared-state-memory-model",{"title":296,"path":297,"stem":298},"Синхронізація — Monitor, lock та еволюція примітивів","/csharp/system-programming-windows/synchronization-fundamentals","01.csharp/07.system-programming-windows/06.synchronization-fundamentals",{"title":300,"path":301,"stem":302},"Синхронізація — Наскрізний Приклад та Deadlock Detection","/csharp/system-programming-windows/06a.synchronization-walkthrough","01.csharp/07.system-programming-windows/06a.synchronization-walkthrough",{"title":304,"path":305,"stem":306},"Синхронізація — Mutex, Semaphore та Event-Based Primitives","/csharp/system-programming-windows/synchronization-advanced","01.csharp/07.system-programming-windows/07.synchronization-advanced",{"title":308,"path":309,"stem":310},"Синхронізація — Interlocked, Volatile та Lock-Free Структури","/csharp/system-programming-windows/07a.synchronization-advanced-walkthrough","01.csharp/07.system-programming-windows/07a.synchronization-advanced-walkthrough",{"title":312,"path":313,"stem":314},"Interlocked, CAS та Lock-Free Структури","/csharp/system-programming-windows/interlocked-cas-lockfree","01.csharp/07.system-programming-windows/08.interlocked-cas-lockfree",{"title":316,"path":317,"stem":318},"Volatile, Memory Model та Spinning","/csharp/system-programming-windows/08a.volatile-memory-model","01.csharp/07.system-programming-windows/08a.volatile-memory-model",{"title":320,"path":321,"stem":322},"ThreadPool — Пул Потоків для Ефективного Виконання","/csharp/system-programming-windows/thread-pool","01.csharp/07.system-programming-windows/09.thread-pool",{"title":324,"path":325,"stem":326},"ThreadPool — Просунуті Сценарії та Внутрішня Будова","/csharp/system-programming-windows/09a.thread-pool-advanced","01.csharp/07.system-programming-windows/09a.thread-pool-advanced",{"title":328,"path":329,"stem":330},"Concurrent та Immutable Collections","/csharp/system-programming-windows/concurrent-collections","01.csharp/07.system-programming-windows/10.concurrent-collections",{"title":332,"path":333,"stem":334},"TPL, Task та Композиція — Від Thread до Task","/csharp/system-programming-windows/tpl-parallel-plinq","01.csharp/07.system-programming-windows/11.tpl-parallel-plinq",{"title":336,"path":337,"stem":338},"Parallel Class та PLINQ — Data Parallelism","/csharp/system-programming-windows/11a.tpl-parallel-plinq-advanced","01.csharp/07.system-programming-windows/11a.tpl-parallel-plinq-advanced",{"title":340,"path":341,"stem":342},"Async/Await — Фундамент Асинхронного Програмування","/csharp/system-programming-windows/async-fundamentals","01.csharp/07.system-programming-windows/12.async-fundamentals",{"title":344,"path":345,"stem":346},"SynchronizationContext та ConfigureAwait — Контекст Виконання","/csharp/system-programming-windows/async-context-configureawait","01.csharp/07.system-programming-windows/13.async-context-configureawait",{"title":348,"path":349,"stem":350},"Async — Просунуті Паттерни","/csharp/system-programming-windows/async-advanced","01.csharp/07.system-programming-windows/14.async-advanced",{"title":352,"path":353,"stem":354},"System.Threading.Channels — Async Producer-Consumer","/csharp/system-programming-windows/channels","01.csharp/07.system-programming-windows/15.channels",{"title":356,"path":357,"stem":358},"Асинхронна Синхронізація","/csharp/system-programming-windows/async-synchronization","01.csharp/07.system-programming-windows/16.async-synchronization",{"title":360,"path":361,"stem":362},"Unsafe Code та Вказівники","/csharp/system-programming-windows/unsafe-code","01.csharp/07.system-programming-windows/17.unsafe-code",{"title":364,"path":365,"stem":366},"P/Invoke та Windows API — Міст між .NET та Native Code","/csharp/system-programming-windows/pinvoke-winapi","01.csharp/07.system-programming-windows/18.pinvoke-winapi",{"title":368,"path":369,"stem":370},"Реєстр Windows — Центральна База Конфігурації Системи","/csharp/system-programming-windows/windows-registry","01.csharp/07.system-programming-windows/19.windows-registry",{"title":372,"path":373,"stem":374},"Windows Hooks, Hotkeys та Services — Глибока Інтеграція з ОС","/csharp/system-programming-windows/windows-hooks-services","01.csharp/07.system-programming-windows/20.windows-hooks-services",{"title":376,"path":377,"stem":378},"Системне Програмування C# (Windows) — 07.system-programming-windows","/csharp/system-programming-windows/implementation_plan","01.csharp/07.system-programming-windows/implementation_plan",{"title":380,"icon":132,"path":381,"stem":382,"children":383,"page":59},"Io","/csharp/io","01.csharp/08.io",[384,388,392,396,400],{"title":385,"path":386,"stem":387},"8.1.1. Основи роботи з файловою системою","/csharp/io/file-system-basics","01.csharp/08.io/01.file-system-basics",{"title":389,"path":390,"stem":391},"8.1.2. Потоки (Streams) та Серіалізація Даних","/csharp/io/streams-serialization","01.csharp/08.io/02.streams-serialization",{"title":393,"path":394,"stem":395},"8.2.1. JSON Serialization з System.Text.Json","/csharp/io/json-serialization","01.csharp/08.io/03.json-serialization",{"title":397,"path":398,"stem":399},"8.2.2. XML Serialization та LINQ to XML","/csharp/io/xml-serialization","01.csharp/08.io/04.xml-serialization",{"title":401,"path":402,"stem":403},"8.2.3. Binary Serialization: MessagePack та Protocol Buffers","/csharp/io/binary-serialization","01.csharp/08.io/05.binary-serialization",{"title":405,"icon":132,"path":406,"stem":407,"children":408,"page":59},"Ado Net","/csharp/ado-net","01.csharp/09.ado-net",[409,413,417,421,425,429,433,437,441,445,449,453],{"title":410,"path":411,"stem":412},"9.1. Введення в ADO.NET","/csharp/ado-net/introduction-to-adonet","01.csharp/09.ado-net/01.introduction-to-adonet",{"title":414,"path":415,"stem":416},"9.2. Клас DbConnection — з'єднання з базою даних","/csharp/ado-net/connection","01.csharp/09.ado-net/02.connection",{"title":418,"path":419,"stem":420},"9.3. Клас DbCommand — виконання SQL-запитів","/csharp/ado-net/command-and-queries","01.csharp/09.ado-net/03.command-and-queries",{"title":422,"path":423,"stem":424},"9.4. Клас DbDataReader — ефективне читання даних","/csharp/ado-net/datareader","01.csharp/09.ado-net/04.datareader",{"title":426,"path":427,"stem":428},"9.5. Параметризовані запити та захист від SQL Injection","/csharp/ado-net/parameters-and-sql-injection","01.csharp/09.ado-net/05.parameters-and-sql-injection",{"title":430,"path":431,"stem":432},"9.6. Транзакції в ADO.NET","/csharp/ado-net/transactions","01.csharp/09.ado-net/06.transactions",{"title":434,"path":435,"stem":436},"9.7. DbProviderFactory — провайдер-незалежний код","/csharp/ado-net/provider-factory","01.csharp/09.ado-net/07.provider-factory",{"title":438,"path":439,"stem":440},"9.8. Асинхронний доступ до даних","/csharp/ado-net/async-data-access","01.csharp/09.ado-net/08.async-data-access",{"title":442,"path":443,"stem":444},"9.9. Від'єднаний режим: DataSet, DataTable, DataRow","/csharp/ado-net/disconnected-mode-dataset","01.csharp/09.ado-net/09.disconnected-mode-dataset",{"title":446,"path":447,"stem":448},"9.10. DataAdapter — міст між DataSet та базою даних","/csharp/ado-net/data-adapter","01.csharp/09.ado-net/10.data-adapter",{"title":450,"path":451,"stem":452},"9.11. Data Mapper та Repository: Архітектура доступу до даних","/csharp/ado-net/data-mapper-repository","01.csharp/09.ado-net/11.data-mapper-repository",{"title":454,"path":455,"stem":456},"9.12. Identity Map, Unit of Work та Specification Pattern","/csharp/ado-net/advanced-patterns","01.csharp/09.ado-net/12.advanced-patterns",{"title":458,"icon":255,"path":459,"stem":460,"children":461,"page":59},"Ef Core","/csharp/ef-core","01.csharp/10.ef-core",[462,466,470,474,478,482,486,490,494,498,502,506,510,514,518,522,526,532,538,542,546,550,554,558,562,566,570,574,578,582,586,590,594,598,602,606,610,614,618,622,626,630,634,638,642,646],{"title":463,"path":464,"stem":465},"Що таке ORM? Від SQL до об'єктів","/csharp/ef-core/what-is-orm","01.csharp/10.ef-core/01.what-is-orm",{"title":467,"path":468,"stem":469},"Перший проєкт — від нуля до CRUD","/csharp/ef-core/first-project","01.csharp/10.ef-core/02.first-project",{"title":471,"path":472,"stem":473},"DbContext — Серце EF Core","/csharp/ef-core/dbcontext-deep-dive","01.csharp/10.ef-core/03.dbcontext-deep-dive",{"title":475,"path":476,"stem":477},"Провайдери баз даних — Архітектура та Вибір СУБД","/csharp/ef-core/database-providers","01.csharp/10.ef-core/04.database-providers",{"title":479,"path":480,"stem":481},"Конвенції EF Core — Магія без конфігурації","/csharp/ef-core/conventions","01.csharp/10.ef-core/05.conventions",{"title":483,"path":484,"stem":485},"Fluent API та Data Annotations — Явна конфігурація моделі","/csharp/ef-core/fluent-api-vs-annotations","01.csharp/10.ef-core/06.fluent-api-vs-annotations",{"title":487,"path":488,"stem":489},"Зв'язки — One-to-One та One-to-Many","/csharp/ef-core/relationships-basics","01.csharp/10.ef-core/07.relationships-basics",{"title":491,"path":492,"stem":493},"Зв'язки Advanced — Many-to-Many та Складні Сценарії","/csharp/ef-core/relationships-advanced","01.csharp/10.ef-core/08.relationships-advanced",{"title":495,"path":496,"stem":497},"Властивості — Типи, Конвертери, Компаратори (Частина 1)","/csharp/ef-core/property-configuration-part1","01.csharp/10.ef-core/09.property-configuration-part1",{"title":499,"path":500,"stem":501},"Властивості — Value Comparers, Generators, Shadow Properties (Частина 2)","/csharp/ef-core/property-configuration-part2","01.csharp/10.ef-core/09.property-configuration-part2",{"title":503,"path":504,"stem":505},"Складні типи — Owned Types та Complex Types (Частина 1)","/csharp/ef-core/complex-types-owned-part1","01.csharp/10.ef-core/10.complex-types-owned-part1",{"title":507,"path":508,"stem":509},"Складні типи — Complex Types, Keyless Entities, Порівняння (Частина 2)","/csharp/ef-core/complex-types-owned-part2","01.csharp/10.ef-core/10.complex-types-owned-part2",{"title":511,"path":512,"stem":513},"JSON Columns — Складні дані у JSON (Частина 1)","/csharp/ef-core/json-columns-part1","01.csharp/10.ef-core/11.json-columns-part1",{"title":515,"path":516,"stem":517},"JSON Columns — Value Comparers, Індекси, Провайдери (Частина 2)","/csharp/ef-core/json-columns-part2","01.csharp/10.ef-core/11.json-columns-part2",{"title":519,"path":520,"stem":521},"Успадкування — Абстрактні класи та TPH (Частина 1)","/csharp/ef-core/inheritance-part1","01.csharp/10.ef-core/12.inheritance-part1",{"title":523,"path":524,"stem":525},"Успадкування — TPT, TPC та Порівняння Стратегій (Частина 2)","/csharp/ef-core/inheritance-part2","01.csharp/10.ef-core/12.inheritance-part2",{"title":527,"path":528,"stem":529,"children":530},"Індекси, Обмеження та Схема (Частина 1)","/csharp/ef-core/indexes-constraints-part1","01.csharp/10.ef-core/13.indexes-constraints-part1",[531],{"title":527,"path":528,"stem":529},{"title":533,"path":534,"stem":535,"children":536},"Індекси, Обмеження та Схема (Частина 2)","/csharp/ef-core/indexes-constraints-part2","01.csharp/10.ef-core/13.indexes-constraints-part2",[537],{"title":533,"path":534,"stem":535},{"title":539,"path":540,"stem":541},"Seed Data — Початкові Дані (Частина 1)","/csharp/ef-core/seeding-part1","01.csharp/10.ef-core/14.seeding-part1",{"title":543,"path":544,"stem":545},"Seed Data — SQL-скрипти, Bogus та Стратегії (Частина 2)","/csharp/ef-core/seeding-part2","01.csharp/10.ef-core/14.seeding-part2",{"title":547,"path":548,"stem":549},"Global Query Filters — Глобальні Фільтри (Частина 1)","/csharp/ef-core/global-query-filters-part1","01.csharp/10.ef-core/15.global-query-filters-part1",{"title":551,"path":552,"stem":553},"Global Query Filters — Підводні камені та Інтеграція (Частина 2)","/csharp/ef-core/global-query-filters-part2","01.csharp/10.ef-core/15.global-query-filters-part2",{"title":555,"path":556,"stem":557},"LINQ-запити в EF Core (Частина 1)","/csharp/ef-core/linq-queries-part1","01.csharp/10.ef-core/16.linq-queries-part1",{"title":559,"path":560,"stem":561},"LINQ-запити в EF Core (Частина 2)","/csharp/ef-core/linq-queries-part2","01.csharp/10.ef-core/16.linq-queries-part2",{"title":563,"path":564,"stem":565},"Завантаження Пов'язаних Даних (Частина 1)","/csharp/ef-core/loading-related-data-part1","01.csharp/10.ef-core/17.loading-related-data-part1",{"title":567,"path":568,"stem":569},"Завантаження Пов'язаних Даних (Частина 2)","/csharp/ef-core/loading-related-data-part2","01.csharp/10.ef-core/17.loading-related-data-part2",{"title":571,"path":572,"stem":573},"Raw SQL, Views та Stored Procedures (Частина 1)","/csharp/ef-core/raw-sql-part1","01.csharp/10.ef-core/18.raw-sql-part1",{"title":575,"path":576,"stem":577},"Raw SQL — Stored Procedures, DbFunction та Bulk Operations (Частина 2)","/csharp/ef-core/raw-sql-part2","01.csharp/10.ef-core/18.raw-sql-part2",{"title":579,"path":580,"stem":581},"Продвинуті Запити — Compiled Queries, Bulk та Оптимізація (Частина 1)","/csharp/ef-core/advanced-queries-part1","01.csharp/10.ef-core/19.advanced-queries-part1",{"title":583,"path":584,"stem":585},"Продвинуті Запити — Query Tags, Bulk та Interceptors (Частина 2)","/csharp/ef-core/advanced-queries-part2","01.csharp/10.ef-core/19.advanced-queries-part2",{"title":587,"path":588,"stem":589},"Change Tracker — Відстеження Змін (Частина 1)","/csharp/ef-core/change-tracking-part1","01.csharp/10.ef-core/20.change-tracking-part1",{"title":591,"path":592,"stem":593},"Change Tracker — Графи Об'єктів та Disconnected (Частина 2)","/csharp/ef-core/change-tracking-part2","01.csharp/10.ef-core/20.change-tracking-part2",{"title":595,"path":596,"stem":597},"Збереження Даних та Транзакції (Частина 1)","/csharp/ef-core/saving-data-part1","01.csharp/10.ef-core/21.saving-data-part1",{"title":599,"path":600,"stem":601},"Збереження Даних — Concurrency та Outbox (Частина 2)","/csharp/ef-core/saving-data-part2","01.csharp/10.ef-core/21.saving-data-part2",{"title":603,"path":604,"stem":605},"Конкурентність та Блокування (Частина 1)","/csharp/ef-core/concurrency-part1","01.csharp/10.ef-core/22.concurrency-part1",{"title":607,"path":608,"stem":609},"Конкурентність — Дедлоки та Queue Processing (Частина 2)","/csharp/ef-core/concurrency-part2","01.csharp/10.ef-core/22.concurrency-part2",{"title":611,"path":612,"stem":613},"Міграції в EF Core — Основи (Частина 1)","/csharp/ef-core/migrations-basics-part1","01.csharp/10.ef-core/23.migrations-basics-part1",{"title":615,"path":616,"stem":617},"Міграції в EF Core — Основи (Частина 2)","/csharp/ef-core/migrations-basics-part2","01.csharp/10.ef-core/23.migrations-basics-part2",{"title":619,"path":620,"stem":621},"Міграції — Просунуті Сценарії (Частина 1)","/csharp/ef-core/migrations-advanced-part1","01.csharp/10.ef-core/24.migrations-advanced-part1",{"title":623,"path":624,"stem":625},"Міграції — Просунуті Сценарії (Частина 2)","/csharp/ef-core/migrations-advanced-part2","01.csharp/10.ef-core/24.migrations-advanced-part2",{"title":627,"path":628,"stem":629},"Управління Схемою та Database-First (Частина 1)","/csharp/ef-core/schema-management-part1","01.csharp/10.ef-core/25.schema-management-part1",{"title":631,"path":632,"stem":633},"Управління Схемою та Database-First (Частина 2)","/csharp/ef-core/schema-management-part2","01.csharp/10.ef-core/25.schema-management-part2",{"title":635,"path":636,"stem":637},"Продуктивність EF Core — Основи (Частина 1)","/csharp/ef-core/performance-fundamentals-part1","01.csharp/10.ef-core/26.performance-fundamentals-part1",{"title":639,"path":640,"stem":641},"Interceptors в EF Core (Частина 1)","/csharp/ef-core/interceptors-part1","01.csharp/10.ef-core/29.interceptors-part1",{"title":643,"path":644,"stem":645},"Interceptors в EF Core — Connection, Transaction та Materialization (Частина 2)","/csharp/ef-core/interceptors-part2","01.csharp/10.ef-core/29.interceptors-part2",{"title":647,"path":648,"stem":649},"План вивчення Entity Framework Core — Повний курс","/csharp/ef-core/implementation_plan","01.csharp/10.ef-core/implementation_plan",{"title":651,"icon":652,"path":653,"stem":654,"children":655,"page":59},"ASP.NET","i-devicon-dotnetcore","/csharp/aspnet","01.csharp/11.aspnet",[656,730,791,869,927,941,967,1057,1111,1182,1212,1289],{"title":657,"icon":658,"path":659,"stem":660,"children":661,"page":59},"Minimal API","i-lucide-network","/csharp/aspnet/minimal-api","01.csharp/11.aspnet/01.minimal-api",[662,666,670,674,678,682,686,690,694,698,702,706,710,714,718,722,726],{"title":663,"path":664,"stem":665},"Вступ до ASP.NET та еволюція фреймворку","/csharp/aspnet/minimal-api/introduction","01.csharp/11.aspnet/01.minimal-api/01.introduction",{"title":667,"path":668,"stem":669},"Перший додаток на ASP.NET Core","/csharp/aspnet/minimal-api/first-application","01.csharp/11.aspnet/01.minimal-api/02.first-application",{"title":671,"path":672,"stem":673},"WebApplication, Builder та Dependency Injection","/csharp/aspnet/minimal-api/webapplication-builder","01.csharp/11.aspnet/01.minimal-api/03.webapplication-builder",{"title":675,"path":676,"stem":677},"Конвеєр запитів та Middleware","/csharp/aspnet/minimal-api/request-pipeline-middleware","01.csharp/11.aspnet/01.minimal-api/04.request-pipeline-middleware",{"title":679,"path":680,"stem":681},"Маршрутизація в ASP.NET Core: Основи","/csharp/aspnet/minimal-api/routing-basics","01.csharp/11.aspnet/01.minimal-api/05.routing-basics",{"title":683,"path":684,"stem":685},"Маршрутизація в ASP.NET Core: Розширені можливості","/csharp/aspnet/minimal-api/routing-advanced","01.csharp/11.aspnet/01.minimal-api/06.routing-advanced",{"title":687,"path":688,"stem":689},"Статичні файли в ASP.NET Core","/csharp/aspnet/minimal-api/static-files","01.csharp/11.aspnet/01.minimal-api/07.static-files",{"title":691,"path":692,"stem":693},"Статичні Активи: MapStaticAssets (ASP.NET Core 9.0)","/csharp/aspnet/minimal-api/static-assets","01.csharp/11.aspnet/01.minimal-api/08.static-assets",{"title":695,"path":696,"stem":697},"Конфігурація в ASP.NET Core: Основи","/csharp/aspnet/minimal-api/configuration-fundamentals","01.csharp/11.aspnet/01.minimal-api/09.configuration-fundamentals",{"title":699,"path":700,"stem":701},"Конфігурація: Паттерн Options","/csharp/aspnet/minimal-api/configuration-options","01.csharp/11.aspnet/01.minimal-api/10.configuration-options",{"title":703,"path":704,"stem":705},"Логування в ASP.NET Core: Основи","/csharp/aspnet/minimal-api/logging-basics","01.csharp/11.aspnet/01.minimal-api/11.logging-basics",{"title":707,"path":708,"stem":709},"Логування: Serilog та Middleware","/csharp/aspnet/minimal-api/logging-advanced","01.csharp/11.aspnet/01.minimal-api/12.logging-advanced",{"title":711,"path":712,"stem":713},"Управління станом: HttpContext.Items та Cookies","/csharp/aspnet/minimal-api/state-management","01.csharp/11.aspnet/01.minimal-api/13.state-management",{"title":715,"path":716,"stem":717},"Стан сесії: Sessions","/csharp/aspnet/minimal-api/session-state","01.csharp/11.aspnet/01.minimal-api/14.session-state",{"title":719,"path":720,"stem":721},"Структура проєкту: від хаосу до архітектури","/csharp/aspnet/minimal-api/project-structure","01.csharp/11.aspnet/01.minimal-api/15.project-structure",{"title":723,"path":724,"stem":725},"Scalar у Minimal API: повний проєкт і Fluent OpenAPI","/csharp/aspnet/minimal-api/scalar-openapi-fluent","01.csharp/11.aspnet/01.minimal-api/16.scalar-openapi-fluent",{"title":727,"path":728,"stem":729},"Swagger / Swashbuckle у Minimal API: окремий класичний шлях","/csharp/aspnet/minimal-api/swagger-swashbuckle","01.csharp/11.aspnet/01.minimal-api/17.swagger-swashbuckle",{"title":731,"icon":658,"path":732,"stem":733,"children":734,"page":59},"API","/csharp/aspnet/api","01.csharp/11.aspnet/02.api",[735,739,743,747,751,755,759,763,767,771,775,779,783,787],{"title":736,"path":737,"stem":738},"Що таке API. Клієнт-серверна архітектура","/csharp/aspnet/api/what-is-api","01.csharp/11.aspnet/02.api/01.what-is-api",{"title":740,"path":741,"stem":742},"Формати даних: JSON, XML, TOML та бінарні формати","/csharp/aspnet/api/data-formats","01.csharp/11.aspnet/02.api/02.data-formats",{"title":744,"path":745,"stem":746},"Парадигми API та концепція REST","/csharp/aspnet/api/api-paradigms-rest","01.csharp/11.aspnet/02.api/03.api-paradigms-rest",{"title":748,"path":749,"stem":750},"HTTP-методи, статус-коди та заголовки","/csharp/aspnet/api/http-methods-status-codes","01.csharp/11.aspnet/02.api/04.http-methods-status-codes",{"title":752,"path":753,"stem":754},"Організація HTTP API за принципами REST","/csharp/aspnet/api/rest-organizing","01.csharp/11.aspnet/02.api/05.rest-organizing",{"title":756,"path":757,"stem":758},"Номенклатура URL та CRUD-операції","/csharp/aspnet/api/url-nomenclature-crud","01.csharp/11.aspnet/02.api/06.url-nomenclature-crud",{"title":760,"path":761,"stem":762},"Правила дизайну: іменування та стандарти","/csharp/aspnet/api/api-design-naming","01.csharp/11.aspnet/02.api/07.api-design-naming",{"title":764,"path":765,"stem":766},"Валідація, ліміти та обробка помилок","/csharp/aspnet/api/api-design-validation","01.csharp/11.aspnet/02.api/08.api-design-validation",{"title":768,"path":769,"stem":770},"Обробка помилок у Minimal API","/csharp/aspnet/api/error-handling-http","01.csharp/11.aspnet/02.api/09.error-handling-http",{"title":772,"path":773,"stem":774},"Ідемпотентність та синхронізація стану","/csharp/aspnet/api/idempotency-sync","01.csharp/11.aspnet/02.api/10.idempotency-sync",{"title":776,"path":777,"stem":778},"Пагінація та організація списків","/csharp/aspnet/api/pagination-lists","01.csharp/11.aspnet/02.api/11.pagination-lists",{"title":780,"path":781,"stem":782},"Безпека API, кешування та інтернаціоналізація","/csharp/aspnet/api/security-auth","01.csharp/11.aspnet/02.api/12.security-auth",{"title":784,"path":785,"stem":786},"Процес проєктування API та документування","/csharp/aspnet/api/api-design-process","01.csharp/11.aspnet/02.api/13.api-design-process",{"title":788,"path":789,"stem":790},"OpenAPI: контракт, специфікація та документація API","/csharp/aspnet/api/openapi","01.csharp/11.aspnet/02.api/14.openapi",{"title":792,"icon":793,"path":794,"stem":795,"children":796,"page":59},"Auth","i-lucide-shield-check","/csharp/aspnet/auth","01.csharp/11.aspnet/03.auth",[797,801,805,809,813,817,821,825,829,833,837,841,845,849,853,857,861,865],{"title":798,"path":799,"stem":800},"Основи аутентифікації та авторизації","/csharp/aspnet/auth/auth-fundamentals","01.csharp/11.aspnet/03.auth/01.auth-fundamentals",{"title":802,"path":803,"stem":804},"JWT-аутентифікація","/csharp/aspnet/auth/jwt-authentication","01.csharp/11.aspnet/03.auth/02.jwt-authentication",{"title":806,"path":807,"stem":808},"Авторизація: ролі, політики та resource-based доступ","/csharp/aspnet/auth/authorization-policies","01.csharp/11.aspnet/03.auth/03.authorization-policies",{"title":810,"path":811,"stem":812},"Cookie-аутентифікація та ASP.NET Core Identity","/csharp/aspnet/auth/cookie-auth-identity","01.csharp/11.aspnet/03.auth/04.cookie-auth-identity",{"title":814,"path":815,"stem":816},"JWT + Refresh Tokens (HttpOnly Cookie)","/csharp/aspnet/auth/04b.identity-auth-jwt","01.csharp/11.aspnet/03.auth/04b.identity-auth-jwt",{"title":818,"path":819,"stem":820},"Identity: Підтвердження Email та Скидання Пароля","/csharp/aspnet/auth/identity-email-confirmation","01.csharp/11.aspnet/03.auth/05.identity-email-confirmation",{"title":822,"path":823,"stem":824},"Identity: Двофакторна Аутентифікація (2FA)","/csharp/aspnet/auth/identity-two-factor","01.csharp/11.aspnet/03.auth/06.identity-two-factor",{"title":826,"path":827,"stem":828},"Identity: Внутрішня Архітектура та Кастомізація","/csharp/aspnet/auth/identity-internals","01.csharp/11.aspnet/03.auth/07.identity-internals",{"title":830,"path":831,"stem":832},"OAuth 2.0 та зовнішні провайдери","/csharp/aspnet/auth/oauth-external-providers","01.csharp/11.aspnet/03.auth/08.oauth-external-providers",{"title":834,"path":835,"stem":836},"Безпека на практиці: CORS, HTTPS та захист від атак","/csharp/aspnet/auth/security-hardening","01.csharp/11.aspnet/03.auth/09.security-hardening",{"title":838,"path":839,"stem":840},"Теорія OAuth 2.0: Поняття, Аналогії та Флоу","/csharp/aspnet/auth/oauth-theory","01.csharp/11.aspnet/03.auth/10.oauth-theory",{"title":842,"path":843,"stem":844},"OIDC, OAuth 2.0 та Keycloak в ASP.NET Core","/csharp/aspnet/auth/oidc-keycloak","01.csharp/11.aspnet/03.auth/10.oidc-keycloak",{"title":846,"path":847,"stem":848},"API Keys аутентифікація в ASP.NET Core","/csharp/aspnet/auth/api-keys","01.csharp/11.aspnet/03.auth/11.api-keys",{"title":850,"path":851,"stem":852},"Rate Limiting та Throttling в ASP.NET Core","/csharp/aspnet/auth/rate-limiting","01.csharp/11.aspnet/03.auth/12.rate-limiting",{"title":854,"path":855,"stem":856},"Refresh Token Rotation в ASP.NET Core","/csharp/aspnet/auth/refresh-token-rotation","01.csharp/11.aspnet/03.auth/13.refresh-token-rotation",{"title":858,"path":859,"stem":860},"Certificate Authentication та mTLS в ASP.NET Core","/csharp/aspnet/auth/certificate-auth","01.csharp/11.aspnet/03.auth/14.certificate-auth",{"title":862,"path":863,"stem":864},"RBAC, ABAC та ReBAC в ASP.NET Core","/csharp/aspnet/auth/rbac-abac-rebac","01.csharp/11.aspnet/03.auth/15.rbac-abac-rebac",{"title":866,"path":867,"stem":868},"Multi-tenancy та ізоляція даних в ASP.NET Core","/csharp/aspnet/auth/multi-tenancy","01.csharp/11.aspnet/03.auth/16.multi-tenancy",{"title":870,"icon":871,"path":872,"stem":873,"children":874,"page":59},"Нотифікації","i-lucide-bell","/csharp/aspnet/notifications","01.csharp/11.aspnet/04.notifications",[875,879,883,887,891,895,899,903,907,911,915,919,923],{"title":876,"path":877,"stem":878},"In-App нотифікації через базу даних","/csharp/aspnet/notifications/in-app-database-notifications","01.csharp/11.aspnet/04.notifications/01.in-app-database-notifications",{"title":880,"path":881,"stem":882},"Polling: Регулярний запит оновлень","/csharp/aspnet/notifications/polling","01.csharp/11.aspnet/04.notifications/02.polling",{"title":884,"path":885,"stem":886},"Server-Sent Events: Однострімовий push від сервера","/csharp/aspnet/notifications/server-sent-events","01.csharp/11.aspnet/04.notifications/03.server-sent-events",{"title":888,"path":889,"stem":890},"WebSockets: Двостороннє з'єднання в реальному часі","/csharp/aspnet/notifications/websockets","01.csharp/11.aspnet/04.notifications/04.websockets",{"title":892,"path":893,"stem":894},"SignalR: Абстракція над транспортами реального часу","/csharp/aspnet/notifications/signalr","01.csharp/11.aspnet/04.notifications/05.signalr",{"title":896,"path":897,"stem":898},"Background Services: Фонові задачі в ASP.NET Core","/csharp/aspnet/notifications/background-services","01.csharp/11.aspnet/04.notifications/06.background-services",{"title":900,"path":901,"stem":902},"Web Push нотифікації","/csharp/aspnet/notifications/web-push","01.csharp/11.aspnet/04.notifications/07.web-push",{"title":904,"path":905,"stem":906},"Email нотифікації","/csharp/aspnet/notifications/email-notifications","01.csharp/11.aspnet/04.notifications/08.email-notifications",{"title":908,"path":909,"stem":910},"Порівняння підходів: Як вибрати правильну технологію нотифікацій","/csharp/aspnet/notifications/choosing-the-right-approach","01.csharp/11.aspnet/04.notifications/09.choosing-the-right-approach",{"title":912,"path":913,"stem":914},"Hangfire: Надійне планування фонових задач","/csharp/aspnet/notifications/hangfire","01.csharp/11.aspnet/04.notifications/10.hangfire",{"title":916,"path":917,"stem":918},"Практика: Конвертація зображень у WebP через Hangfire","/csharp/aspnet/notifications/hangfire-image-webp","01.csharp/11.aspnet/04.notifications/11.hangfire-image-webp",{"title":920,"path":921,"stem":922},"Практика: Підготовка відео до HLS-стрімінгу через Hangfire","/csharp/aspnet/notifications/hangfire-video-hls","01.csharp/11.aspnet/04.notifications/12.hangfire-video-hls",{"title":924,"path":925,"stem":926},"Telegram-нотифікації: від одного повідомлення до масових розсилок і мульти-канального підходу","/csharp/aspnet/notifications/telegram-notifications","01.csharp/11.aspnet/04.notifications/13.telegram-notifications",{"title":928,"icon":929,"path":930,"stem":931,"children":932,"page":59},"Інтернаціоналізація","i-lucide-languages","/csharp/aspnet/i18n","01.csharp/11.aspnet/05.i18n",[933,937],{"title":934,"path":935,"stem":936},"Інтернаціоналізація (i18n) у Minimal API: від A до Я","/csharp/aspnet/i18n/internationalization","01.csharp/11.aspnet/05.i18n/01.internationalization",{"title":938,"path":939,"stem":940},"Humanizer: людиномовні рядки у .NET","/csharp/aspnet/i18n/humanizer","01.csharp/11.aspnet/05.i18n/02.humanizer",{"title":942,"icon":943,"path":944,"stem":945,"children":946,"page":59},"Кешування","i-lucide-layers","/csharp/aspnet/caching","01.csharp/11.aspnet/06.caching",[947,951,955,959,963],{"title":948,"path":949,"stem":950},"Огляд кешування: чотири рівні і коли що обирати","/csharp/aspnet/caching/caching","01.csharp/11.aspnet/06.caching/01.caching",{"title":952,"path":953,"stem":954},"IMemoryCache: кеш в оперативній пам'яті","/csharp/aspnet/caching/memory-cache","01.csharp/11.aspnet/06.caching/02.memory-cache",{"title":956,"path":957,"stem":958},"IDistributedCache і Redis: розподілений кеш","/csharp/aspnet/caching/distributed-cache","01.csharp/11.aspnet/06.caching/03.distributed-cache",{"title":960,"path":961,"stem":962},"Response Cache: HTTP-кешування через Cache-Control","/csharp/aspnet/caching/response-cache","01.csharp/11.aspnet/06.caching/04.response-cache",{"title":964,"path":965,"stem":966},"Output Cache: серверний кеш HTTP-відповідей (.NET 7+)","/csharp/aspnet/caching/output-cache","01.csharp/11.aspnet/06.caching/05.output-cache",{"title":968,"icon":969,"path":970,"stem":971,"children":972,"page":59},"Тестування","i-lucide-test-tube","/csharp/aspnet/testing","01.csharp/11.aspnet/07.testing",[973,977,981,985,989,993,997,1001,1005,1009,1013,1017,1021,1025,1029,1033,1037,1041,1045,1049,1053],{"title":974,"path":975,"stem":976},"Що таке тестування? Від інтуїції до науки","/csharp/aspnet/testing/what-is-testing","01.csharp/11.aspnet/07.testing/01.what-is-testing",{"title":978,"path":979,"stem":980},"Піраміда тестування — Стратегія, а не Догма","/csharp/aspnet/testing/testing-pyramid","01.csharp/11.aspnet/07.testing/02.testing-pyramid",{"title":982,"path":983,"stem":984},"Дві Школи Тестування — Лондон проти Детройту","/csharp/aspnet/testing/testing-schools","01.csharp/11.aspnet/07.testing/03.testing-schools",{"title":986,"path":987,"stem":988},"TDD та BDD — Тести як Дизайн-інструмент","/csharp/aspnet/testing/tdd-and-bdd","01.csharp/11.aspnet/07.testing/04.tdd-and-bdd",{"title":990,"path":991,"stem":992},"Що саме тестувати — Техніки аналізу та Циклomatична складність","/csharp/aspnet/testing/what-to-test","01.csharp/11.aspnet/07.testing/05.what-to-test",{"title":994,"path":995,"stem":996},"Тестові Фреймворки — Навіщо вони і що всередині","/csharp/aspnet/testing/test-frameworks","01.csharp/11.aspnet/07.testing/06.test-frameworks",{"title":998,"path":999,"stem":1000},"xUnit — Факти, Теорії та Lifecycle тестів","/csharp/aspnet/testing/xunit-basics","01.csharp/11.aspnet/07.testing/07.xunit-basics",{"title":1002,"path":1003,"stem":1004},"xUnit Advanced — Fixtures, Кастомізація та Розширення","/csharp/aspnet/testing/xunit-advanced","01.csharp/11.aspnet/07.testing/08.xunit-advanced",{"title":1006,"path":1007,"stem":1008},"Moq — Глибоке занурення в мокування","/csharp/aspnet/testing/mocking-with-moq","01.csharp/11.aspnet/07.testing/09.mocking-with-moq",{"title":1010,"path":1011,"stem":1012},"Тестування Баз Даних — EF Core, SQLite та Testcontainers","/csharp/aspnet/testing/database-testing","01.csharp/11.aspnet/07.testing/10.database-testing",{"title":1014,"path":1015,"stem":1016},"Integration Testing — Частина 1 [Теорія та WebApplicationFactory]","/csharp/aspnet/testing/integration-testing","01.csharp/11.aspnet/07.testing/11.integration-testing",{"title":1018,"path":1019,"stem":1020},"Інтеграційне тестування — Практика","/csharp/aspnet/testing/11a.integration-testing-practice","01.csharp/11.aspnet/07.testing/11a.integration-testing-practice",{"title":1022,"path":1023,"stem":1024},"Integration Testing — Частина 2 [Просунуті Сценарії та Testcontainers]","/csharp/aspnet/testing/integration-testing-advanced","01.csharp/11.aspnet/07.testing/12.integration-testing-advanced",{"title":1026,"path":1027,"stem":1028},"Професійний Postman: Колекції, Змінні та GitHub Інтеграція","/csharp/aspnet/testing/postman-professional","01.csharp/11.aspnet/07.testing/13.postman-professional",{"title":1030,"path":1031,"stem":1032},"HttpClient у Тестах Частина 1: Архітектура та MockHttpMessageHandler","/csharp/aspnet/testing/httpclient-testing","01.csharp/11.aspnet/07.testing/14.httpclient-testing",{"title":1034,"path":1035,"stem":1036},"HttpClient у Тестах Частина 2: WireMock.Net та Resilience","/csharp/aspnet/testing/wiremock-net","01.csharp/11.aspnet/07.testing/15.wiremock-net",{"title":1038,"path":1039,"stem":1040},"Патерни та Анти-патерни Тестування: Test Smells","/csharp/aspnet/testing/testing-patterns","01.csharp/11.aspnet/07.testing/16.testing-patterns",{"title":1042,"path":1043,"stem":1044},"Просунуті інструменти: Time, Snapshots та Властивості","/csharp/aspnet/testing/advanced-testing-tools","01.csharp/11.aspnet/07.testing/17.advanced-testing-tools",{"title":1046,"path":1047,"stem":1048},"Тестування Архітектури з NetArchTest","/csharp/aspnet/testing/architecture-testing","01.csharp/11.aspnet/07.testing/18.architecture-testing",{"title":1050,"path":1051,"stem":1052},"Тестування Продуктивності: BenchmarkDotNet, NBomber та k6","/csharp/aspnet/testing/performance-testing","01.csharp/11.aspnet/07.testing/19.performance-testing",{"title":1054,"path":1055,"stem":1056},"Залишок плану для курсу \"Тестування ASP.NET Minimal API\"","/csharp/aspnet/testing/remaining_plan","01.csharp/11.aspnet/07.testing/remaining_plan",{"title":1058,"icon":1059,"path":1060,"stem":1061,"children":1062,"page":59},"Платежі","i-lucide-credit-card","/csharp/aspnet/payments","01.csharp/11.aspnet/08.payments",[1063,1067,1071,1075,1079,1083,1087,1091,1095,1099,1103,1107],{"title":1064,"path":1065,"stem":1066},"Основи платіжної інфраструктури","/csharp/aspnet/payments/payment-fundamentals","01.csharp/11.aspnet/08.payments/01.payment-fundamentals",{"title":1068,"path":1069,"stem":1070},"Методи оплати в Україні","/csharp/aspnet/payments/payment-methods-ukraine","01.csharp/11.aspnet/08.payments/02.payment-methods-ukraine",{"title":1072,"path":1073,"stem":1074},"PCI DSS та безпека платежів","/csharp/aspnet/payments/pci-dss-security","01.csharp/11.aspnet/08.payments/03.pci-dss-security",{"title":1076,"path":1077,"stem":1078},"Архітектура платіжної підсистеми","/csharp/aspnet/payments/payment-architecture","01.csharp/11.aspnet/08.payments/04.payment-architecture",{"title":1080,"path":1081,"stem":1082},"Інтеграція LiqPay (ПриватБанк)","/csharp/aspnet/payments/liqpay-integration","01.csharp/11.aspnet/08.payments/05.liqpay-integration",{"title":1084,"path":1085,"stem":1086},"Інтеграція Monobank Acquiring API","/csharp/aspnet/payments/monobank-acquiring","01.csharp/11.aspnet/08.payments/06.monobank-acquiring",{"title":1088,"path":1089,"stem":1090},"Інтеграція Stripe","/csharp/aspnet/payments/stripe-integration","01.csharp/11.aspnet/08.payments/07.stripe-integration",{"title":1092,"path":1093,"stem":1094},"Webhooks — глибоке занурення","/csharp/aspnet/payments/webhooks-deep-dive","01.csharp/11.aspnet/08.payments/08.webhooks-deep-dive",{"title":1096,"path":1097,"stem":1098},"Підписки та рекурентні платежі","/csharp/aspnet/payments/subscriptions-recurring","01.csharp/11.aspnet/08.payments/09.subscriptions-recurring",{"title":1100,"path":1101,"stem":1102},"Повернення коштів та диспути","/csharp/aspnet/payments/refunds-disputes","01.csharp/11.aspnet/08.payments/10.refunds-disputes",{"title":1104,"path":1105,"stem":1106},"Тестування платіжних інтеграцій","/csharp/aspnet/payments/testing-payments","01.csharp/11.aspnet/08.payments/11.testing-payments",{"title":1108,"path":1109,"stem":1110},"Чекліст виходу в Production","/csharp/aspnet/payments/production-checklist","01.csharp/11.aspnet/08.payments/12.production-checklist",{"title":1112,"icon":1113,"items":1114,"path":1127,"stem":1128,"children":1129,"page":59},"Популярні бібліотеки","lucide:box",[1115,1116,1117,1118,1119,1120,1121,1122,1123,1124,1125,1126],"01.fluent-validation","02.mapster","03.erroror-result-pattern","04.serilog","05.mediatr","06.polly","07.health-checks","08.feature-management","09.fluent-email","10.quest-pdf","11.bogus","12.humanizer-guard","/csharp/aspnet/libraries","01.csharp/11.aspnet/09.libraries",[1130,1134,1138,1142,1146,1150,1154,1158,1162,1166,1170,1174,1178],{"title":1131,"path":1132,"stem":1133},"Валідація з FluentValidation в ASP.NET Core","/csharp/aspnet/libraries/fluent-validation","01.csharp/11.aspnet/09.libraries/01.fluent-validation",{"title":1135,"path":1136,"stem":1137},"Маппінг об","/csharp/aspnet/libraries/mapster","01.csharp/11.aspnet/09.libraries/02.mapster",{"title":1139,"path":1140,"stem":1141},"Обробка помилок з ErrorOr та Result Pattern в ASP.NET Core","/csharp/aspnet/libraries/erroror-result-pattern","01.csharp/11.aspnet/09.libraries/03.erroror-result-pattern",{"title":1143,"path":1144,"stem":1145},"Структуроване логування з Serilog в ASP.NET Core","/csharp/aspnet/libraries/serilog","01.csharp/11.aspnet/09.libraries/04.serilog",{"title":1147,"path":1148,"stem":1149},"CQRS та Mediator з MediatR в ASP.NET Core","/csharp/aspnet/libraries/mediatr","01.csharp/11.aspnet/09.libraries/05.mediatr",{"title":1151,"path":1152,"stem":1153},"Відмовостійкість з Polly в ASP.NET Core","/csharp/aspnet/libraries/polly","01.csharp/11.aspnet/09.libraries/06.polly",{"title":1155,"path":1156,"stem":1157},"Health Checks в ASP.NET Core","/csharp/aspnet/libraries/health-checks","01.csharp/11.aspnet/09.libraries/07.health-checks",{"title":1159,"path":1160,"stem":1161},"Feature Management та Feature Flags в ASP.NET Core","/csharp/aspnet/libraries/feature-management","01.csharp/11.aspnet/09.libraries/08.feature-management",{"title":1163,"path":1164,"stem":1165},"Відправка Email з FluentEmail в ASP.NET Core","/csharp/aspnet/libraries/fluent-email","01.csharp/11.aspnet/09.libraries/09.fluent-email",{"title":1167,"path":1168,"stem":1169},"Генерація PDF з QuestPDF в ASP.NET Core","/csharp/aspnet/libraries/quest-pdf","01.csharp/11.aspnet/09.libraries/10.quest-pdf",{"title":1171,"path":1172,"stem":1173},"Генерація тестових даних з Bogus в ASP.NET Core","/csharp/aspnet/libraries/bogus","01.csharp/11.aspnet/09.libraries/11.bogus",{"title":1175,"path":1176,"stem":1177},"Humanizer та Guard Clauses в ASP.NET Core","/csharp/aspnet/libraries/humanizer-guard","01.csharp/11.aspnet/09.libraries/12.humanizer-guard",{"title":1179,"path":1180,"stem":1181},"План модуля 10.libraries — Популярні бібліотеки ASP.NET","/csharp/aspnet/libraries/plan","01.csharp/11.aspnet/09.libraries/plan",{"title":1183,"icon":1184,"path":1185,"stem":1186,"children":1187,"page":59},"Razor Pages","i-lucide-layout-template","/csharp/aspnet/razor-pages","01.csharp/11.aspnet/10.razor-pages",[1188,1192,1196,1200,1204,1208],{"title":1189,"path":1190,"stem":1191},"Від Minimal API до Razor Pages: концептуальний перехід","/csharp/aspnet/razor-pages/from-minimal-api","01.csharp/11.aspnet/10.razor-pages/01.from-minimal-api",{"title":1193,"path":1194,"stem":1195},"PageModel: логіка сторінки Razor Pages","/csharp/aspnet/razor-pages/page-model","01.csharp/11.aspnet/10.razor-pages/02.page-model",{"title":1197,"path":1198,"stem":1199},"Razor синтаксис: шаблонізатор у .cshtml","/csharp/aspnet/razor-pages/razor-syntax","01.csharp/11.aspnet/10.razor-pages/03.razor-syntax",{"title":1201,"path":1202,"stem":1203},"Tag Helpers: типізований HTML","/csharp/aspnet/razor-pages/tag-helpers","01.csharp/11.aspnet/10.razor-pages/04.tag-helpers",{"title":1205,"path":1206,"stem":1207},"Форми і валідація: повний цикл обробки даних","/csharp/aspnet/razor-pages/forms-validation","01.csharp/11.aspnet/10.razor-pages/05.forms-validation",{"title":1209,"path":1210,"stem":1211},"Практичний проєкт: TaskManager на Razor Pages","/csharp/aspnet/razor-pages/project-task-manager","01.csharp/11.aspnet/10.razor-pages/06.project-task-manager",{"title":1213,"path":1214,"stem":1215,"children":1216,"page":59},"ASP.NET Core MVC","/csharp/aspnet/mvc","01.csharp/11.aspnet/11.mvc",[1217,1221,1225,1229,1233,1237,1241,1245,1249,1253,1257,1261,1265,1269,1273,1277,1281,1285],{"title":1218,"path":1219,"stem":1220},"Патерн MVC: архітектура, що змінила веб","/csharp/aspnet/mvc/mvc-pattern","01.csharp/11.aspnet/11.mvc/01.mvc-pattern",{"title":1222,"path":1223,"stem":1224},"Від Razor Pages до MVC: концептуальний перехід","/csharp/aspnet/mvc/from-razor-pages","01.csharp/11.aspnet/11.mvc/02.from-razor-pages",{"title":1226,"path":1227,"stem":1228},"Controllers та Actions: серце MVC","/csharp/aspnet/mvc/controllers-actions","01.csharp/11.aspnet/11.mvc/03.controllers-actions",{"title":1230,"path":1231,"stem":1232},"Маршрутизація в MVC: Convention vs Attribute Routing","/csharp/aspnet/mvc/routing-mvc","01.csharp/11.aspnet/11.mvc/04.routing-mvc",{"title":1234,"path":1235,"stem":1236},"Model Binding: від HTTP до C#","/csharp/aspnet/mvc/model-binding","01.csharp/11.aspnet/11.mvc/05.model-binding",{"title":1238,"path":1239,"stem":1240},"Views, ViewData, ViewBag, TempData і ViewModel","/csharp/aspnet/mvc/views-viewdata-tempdata","01.csharp/11.aspnet/11.mvc/06.views-viewdata-tempdata",{"title":1242,"path":1243,"stem":1244},"Filters: аспектно-орієнтоване програмування в MVC","/csharp/aspnet/mvc/filters","01.csharp/11.aspnet/11.mvc/07.filters",{"title":1246,"path":1247,"stem":1248},"Areas: структурування великих застосунків","/csharp/aspnet/mvc/areas","01.csharp/11.aspnet/11.mvc/08.areas",{"title":1250,"path":1251,"stem":1252},"View Components: повторювані незалежні блоки UI","/csharp/aspnet/mvc/view-components","01.csharp/11.aspnet/11.mvc/09.view-components",{"title":1254,"path":1255,"stem":1256},"Display та Editor Templates","/csharp/aspnet/mvc/display-editor-templates","01.csharp/11.aspnet/11.mvc/10.display-editor-templates",{"title":1258,"path":1259,"stem":1260},"Валідація: IValidatableObject та FluentValidation","/csharp/aspnet/mvc/validation-advanced","01.csharp/11.aspnet/11.mvc/11.validation-advanced",{"title":1262,"path":1263,"stem":1264},"HTMX: інтерактивність через HTML-атрибути","/csharp/aspnet/mvc/htmx","01.csharp/11.aspnet/11.mvc/12.htmx",{"title":1266,"path":1267,"stem":1268},"HTMX у ASP.NET Core MVC: серверна інтеграція","/csharp/aspnet/mvc/ajax-htmx-mvc","01.csharp/11.aspnet/11.mvc/13.ajax-htmx-mvc",{"title":1270,"path":1271,"stem":1272},"Практичний проєкт: Каталог товарів з HTMX","/csharp/aspnet/mvc/htmx-project","01.csharp/11.aspnet/11.mvc/14.htmx-project",{"title":1274,"path":1275,"stem":1276},"Завантаження та обробка файлів","/csharp/aspnet/mvc/file-upload","01.csharp/11.aspnet/11.mvc/15.file-upload",{"title":1278,"path":1279,"stem":1280},"Глобалізація та Локалізація MVC","/csharp/aspnet/mvc/globalization-localization","01.csharp/11.aspnet/11.mvc/16.globalization-localization",{"title":1282,"path":1283,"stem":1284},"Підсумковий проєкт: Блог-платформа","/csharp/aspnet/mvc/mvc-project","01.csharp/11.aspnet/11.mvc/17.mvc-project",{"title":1286,"path":1287,"stem":1288},"План курсу: ASP.NET Core MVC","/csharp/aspnet/mvc/plan","01.csharp/11.aspnet/11.mvc/plan",{"title":1290,"path":1291,"stem":1292,"children":1293,"page":59},"Web Api","/csharp/aspnet/web-api","01.csharp/11.aspnet/12.web-api",[1294,1298,1302,1306,1310,1314,1318,1322,1326,1330,1334,1338,1342],{"title":1295,"path":1296,"stem":1297},"Від Minimal API до Controller-based API","/csharp/aspnet/web-api/from-minimal-api-to-controllers","01.csharp/11.aspnet/12.web-api/01.from-minimal-api-to-controllers",{"title":1299,"path":1300,"stem":1301},"ControllerBase, ActionResult\u003CT> та Response Types","/csharp/aspnet/web-api/controller-base-actionresult","01.csharp/11.aspnet/12.web-api/02.controller-base-actionresult",{"title":1303,"path":1304,"stem":1305},"Content Negotiation - JSON, XML та власні форматери","/csharp/aspnet/web-api/content-negotiation","01.csharp/11.aspnet/12.web-api/03.content-negotiation",{"title":1307,"path":1308,"stem":1309},"Версіонування API","/csharp/aspnet/web-api/api-versioning","01.csharp/11.aspnet/12.web-api/04.api-versioning",{"title":1311,"path":1312,"stem":1313},"ProblemDetails та структурована обробка помилок","/csharp/aspnet/web-api/problemdetails-error-handling","01.csharp/11.aspnet/12.web-api/05.problemdetails-error-handling",{"title":1315,"path":1316,"stem":1317},"Фільтри у Web API контексті","/csharp/aspnet/web-api/filters-for-api","01.csharp/11.aspnet/12.web-api/06.filters-for-api",{"title":1319,"path":1320,"stem":1321},"Пагінація, фільтрація та сортування","/csharp/aspnet/web-api/pagination-filtering-sorting","01.csharp/11.aspnet/12.web-api/07.pagination-filtering-sorting",{"title":1323,"path":1324,"stem":1325},"HATEOAS та Resource Expansion","/csharp/aspnet/web-api/hateoas-resource-expansion","01.csharp/11.aspnet/12.web-api/08.hateoas-resource-expansion",{"title":1327,"path":1328,"stem":1329},"Гібридна архітектура - Minimal API + Controllers","/csharp/aspnet/web-api/minimal-api-vs-controllers-hybrid","01.csharp/11.aspnet/12.web-api/09.minimal-api-vs-controllers-hybrid",{"title":1331,"path":1332,"stem":1333},"Документація API - Swashbuckle, NSwag та генерація клієнтів","/csharp/aspnet/web-api/api-documentation-generation","01.csharp/11.aspnet/12.web-api/10.api-documentation-generation",{"title":1335,"path":1336,"stem":1337},"Health Checks та моніторинг API","/csharp/aspnet/web-api/health-checks-monitoring","01.csharp/11.aspnet/12.web-api/11.health-checks-monitoring",{"title":1339,"path":1340,"stem":1341},"Підсумковий проєкт - Production-Ready REST API","/csharp/aspnet/web-api/web-api-project","01.csharp/11.aspnet/12.web-api/12.web-api-project",{"title":1343,"path":1344,"stem":1345},"План курсу: ASP.NET Core Web API (Controllers)","/csharp/aspnet/web-api/plan","01.csharp/11.aspnet/12.web-api/plan",{"title":1347,"icon":1348,"path":1349,"stem":1350,"children":1351,"page":59},"Desktop UI","i-lucide-app-window","/csharp/desktop-ui","01.csharp/12.desktop-ui",[1352,1356,1360,1364,1368,1372,1376,1380,1384,1388,1392,1396,1400,1404,1408,1412,1416,1420,1424,1428,1432,1436,1440,1444,1448,1452,1456,1460,1464,1468,1472,1476,1480,1484,1488,1492,1496,1500,1504,1508,1512,1516,1520,1524,1528,1532,1536,1540,1544,1548,1552,1556,1560,1564,1568,1572,1576,1580,1584,1588,1592,1596,1600,1604,1608,1612,1616,1620,1624,1628,1632],{"title":1353,"path":1354,"stem":1355},"Що таке десктопна розробка?","/csharp/desktop-ui/what-is-desktop-dev","01.csharp/12.desktop-ui/01.what-is-desktop-dev",{"title":1357,"path":1358,"stem":1359},"Архітектура WPF — як влаштований графічний інтерфейс","/csharp/desktop-ui/wpf-architecture","01.csharp/12.desktop-ui/02.wpf-architecture",{"title":1361,"path":1362,"stem":1363},"Перший WPF-проєкт — від нуля до вікна","/csharp/desktop-ui/first-wpf-app","01.csharp/12.desktop-ui/03.first-wpf-app",{"title":1365,"path":1366,"stem":1367},"Перший Avalonia-проєкт: WPF для всіх платформ","/csharp/desktop-ui/03a.first-avalonia-app","01.csharp/12.desktop-ui/03a.first-avalonia-app",{"title":1369,"path":1370,"stem":1371},"XAML: декларативний інтерфейс","/csharp/desktop-ui/xaml-basics","01.csharp/12.desktop-ui/04.xaml-basics",{"title":1373,"path":1374,"stem":1375},"Fluent UI у WPF — сучасний дизайн Windows 11","/csharp/desktop-ui/04a.wpf-fluent-ui","01.csharp/12.desktop-ui/04a.wpf-fluent-ui",{"title":1377,"path":1378,"stem":1379},"WPF UI — сучасна бібліотека Fluent контролів","/csharp/desktop-ui/04b.wpf-ui-library","01.csharp/12.desktop-ui/04b.wpf-ui-library",{"title":1381,"path":1382,"stem":1383},"HandyControl — велика бібліотека UI контролів для WPF","/csharp/desktop-ui/04c.handycontrol-library","01.csharp/12.desktop-ui/04c.handycontrol-library",{"title":1385,"path":1386,"stem":1387},"Простори імен та ресурси XAML","/csharp/desktop-ui/xaml-namespaces-resources","01.csharp/12.desktop-ui/05.xaml-namespaces-resources",{"title":1389,"path":1390,"stem":1391},"XAML в Avalonia: ключові відмінності від WPF","/csharp/desktop-ui/05a.avalonia-xaml-differences","01.csharp/12.desktop-ui/05a.avalonia-xaml-differences",{"title":1393,"path":1394,"stem":1395},"Розширення розмітки XAML (Markup Extensions)","/csharp/desktop-ui/xaml-markup-extensions","01.csharp/12.desktop-ui/06.xaml-markup-extensions",{"title":1397,"path":1398,"stem":1399},"Панелі Layout: StackPanel, WrapPanel, DockPanel","/csharp/desktop-ui/layout-panels-part1","01.csharp/12.desktop-ui/07.layout-panels-part1",{"title":1401,"path":1402,"stem":1403},"Grid, Canvas, UniformGrid","/csharp/desktop-ui/layout-panels-part2","01.csharp/12.desktop-ui/07.layout-panels-part2",{"title":1405,"path":1406,"stem":1407},"Просунуті техніки Layout","/csharp/desktop-ui/layout-advanced","01.csharp/12.desktop-ui/08.layout-advanced",{"title":1409,"path":1410,"stem":1411},"Адаптивний Layout та найкращі практики","/csharp/desktop-ui/layout-responsive","01.csharp/12.desktop-ui/09.layout-responsive",{"title":1413,"path":1414,"stem":1415},"Layout в Avalonia: відмінності та нові можливості","/csharp/desktop-ui/09a.layout-avalonia","01.csharp/12.desktop-ui/09a.layout-avalonia",{"title":1417,"path":1418,"stem":1419},"Button, Image, ProgressBar та інші базові контроли","/csharp/desktop-ui/basic-controls","01.csharp/12.desktop-ui/10.basic-controls",{"title":1421,"path":1422,"stem":1423},"Контроли в Avalonia: відмінності від WPF","/csharp/desktop-ui/10a.controls-avalonia","01.csharp/12.desktop-ui/10a.controls-avalonia",{"title":1425,"path":1426,"stem":1427},"Текстові контроли — TextBlock, TextBox, RichTextBox","/csharp/desktop-ui/text-controls","01.csharp/12.desktop-ui/11.text-controls",{"title":1429,"path":1430,"stem":1431},"Контроли вибору — CheckBox, RadioButton, ComboBox, ListBox, DatePicker","/csharp/desktop-ui/selection-controls","01.csharp/12.desktop-ui/12.selection-controls",{"title":1433,"path":1434,"stem":1435},"Content Model — GroupBox, Expander, TabControl, StatusBar","/csharp/desktop-ui/content-controls","01.csharp/12.desktop-ui/13.content-controls",{"title":1437,"path":1438,"stem":1439},"UI/UX принципи десктопних застосунків","/csharp/desktop-ui/13a.ui-ux-principles","01.csharp/12.desktop-ui/13a.ui-ux-principles",{"title":1441,"path":1442,"stem":1443},"Dependency Properties — Концепція та Value Resolution","/csharp/desktop-ui/dependency-properties-part1","01.csharp/12.desktop-ui/14.dependency-properties-part1",{"title":1445,"path":1446,"stem":1447},"Avalonia Property System — StyledProperty та DirectProperty","/csharp/desktop-ui/14a.avalonia-property-system","01.csharp/12.desktop-ui/14a.avalonia-property-system",{"title":1449,"path":1450,"stem":1451},"Attached Properties — Властивості без меж","/csharp/desktop-ui/attached-properties","01.csharp/12.desktop-ui/15.attached-properties",{"title":1453,"path":1454,"stem":1455},"Routed Events — Маршрутизація подій у WPF","/csharp/desktop-ui/routed-events","01.csharp/12.desktop-ui/16.routed-events",{"title":1457,"path":1458,"stem":1459},"Data Binding — Від Code-Behind до Декларативності","/csharp/desktop-ui/data-binding-basics-part1","01.csharp/12.desktop-ui/17.data-binding-basics-part1",{"title":1461,"path":1462,"stem":1463},"INotifyPropertyChanged — Живе оновлення UI","/csharp/desktop-ui/data-binding-basics-part2","01.csharp/12.desktop-ui/17.data-binding-basics-part2",{"title":1465,"path":1466,"stem":1467},"Compiled Bindings в Avalonia — Безпека на етапі компіляції","/csharp/desktop-ui/17a.avalonia-compiled-bindings","01.csharp/12.desktop-ui/17a.avalonia-compiled-bindings",{"title":1469,"path":1470,"stem":1471},"Просунутий Data Binding — ElementName, RelativeSource, MultiBinding","/csharp/desktop-ui/data-binding-advanced","01.csharp/12.desktop-ui/18.data-binding-advanced",{"title":1473,"path":1474,"stem":1475},"Value Converters — Перетворення типів даних у Data Binding","/csharp/desktop-ui/value-converters","01.csharp/12.desktop-ui/19.value-converters",{"title":1477,"path":1478,"stem":1479},"Data Templates — Візуалізація об'єктів у WPF","/csharp/desktop-ui/data-templates","01.csharp/12.desktop-ui/20.data-templates",{"title":1481,"path":1482,"stem":1483},"Collections Binding Part 1 — ObservableCollection та ItemsControl","/csharp/desktop-ui/collections-binding-part1","01.csharp/12.desktop-ui/21.collections-binding-part1",{"title":1485,"path":1486,"stem":1487},"Collections Binding Part 2 — ICollectionView, Filtering, Sorting та Virtualization","/csharp/desktop-ui/collections-binding-part2","01.csharp/12.desktop-ui/21.collections-binding-part2",{"title":1489,"path":1490,"stem":1491},"MVVM Pattern — Від Spaghetti Code до архітектури","/csharp/desktop-ui/mvvm-pattern","01.csharp/12.desktop-ui/22.mvvm-pattern",{"title":1493,"path":1494,"stem":1495},"ViewModel Implementation — Від BaseViewModel до валідації","/csharp/desktop-ui/viewmodel-implementation","01.csharp/12.desktop-ui/23.viewmodel-implementation",{"title":1497,"path":1498,"stem":1499},"Commands — Від event handlers до декларативних команд","/csharp/desktop-ui/commands","01.csharp/12.desktop-ui/24.commands",{"title":1501,"path":1502,"stem":1503},"MVVM Toolkit — MVVM без boilerplate через Source Generators","/csharp/desktop-ui/mvvm-toolkit","01.csharp/12.desktop-ui/25.mvvm-toolkit",{"title":1505,"path":1506,"stem":1507},"Messenger Pattern — Комунікація між ViewModel без прямих посилань","/csharp/desktop-ui/messenger-pattern","01.csharp/12.desktop-ui/26.messenger-pattern",{"title":1509,"path":1510,"stem":1511},"Стилі WPF — CSS для десктопу","/csharp/desktop-ui/styles-basics","01.csharp/12.desktop-ui/27.styles-basics",{"title":1513,"path":1514,"stem":1515},"CSS-like стилі Avalonia","/csharp/desktop-ui/27a.avalonia-css-styling","01.csharp/12.desktop-ui/27a.avalonia-css-styling",{"title":1517,"path":1518,"stem":1519},"Control Templates — Частина 1. Концепція та TemplateBinding","/csharp/desktop-ui/control-templates-part1","01.csharp/12.desktop-ui/28.control-templates-part1",{"title":1521,"path":1522,"stem":1523},"Control Templates — Частина 2. Named Parts та ContentPresenter","/csharp/desktop-ui/control-templates-part2","01.csharp/12.desktop-ui/28.control-templates-part2",{"title":1525,"path":1526,"stem":1527},"Control Themes в Avalonia — нова ера стилізації","/csharp/desktop-ui/28a.avalonia-control-themes","01.csharp/12.desktop-ui/28a.avalonia-control-themes",{"title":1529,"path":1530,"stem":1531},"Triggers та Visual State Manager у WPF","/csharp/desktop-ui/triggers-visual-states","01.csharp/12.desktop-ui/29.triggers-visual-states",{"title":1533,"path":1534,"stem":1535},"Pseudo-classes в Avalonia — замість WPF Triggers","/csharp/desktop-ui/29a.avalonia-pseudo-classes","01.csharp/12.desktop-ui/29a.avalonia-pseudo-classes",{"title":1537,"path":1538,"stem":1539},"Теми та ресурсні словники у WPF","/csharp/desktop-ui/resources-themes","01.csharp/12.desktop-ui/30.resources-themes",{"title":1541,"path":1542,"stem":1543},"Avalonia Themes — Fluent Design та система тематизації","/csharp/desktop-ui/30a.avalonia-themes-fluent","01.csharp/12.desktop-ui/30a.avalonia-themes-fluent",{"title":1545,"path":1546,"stem":1547},"Контроли колекцій — глибоке занурення","/csharp/desktop-ui/collection-controls","01.csharp/12.desktop-ui/31.collection-controls",{"title":1549,"path":1550,"stem":1551},"DataGrid — колонки та базове відображення","/csharp/desktop-ui/datagrid-part1","01.csharp/12.desktop-ui/32.datagrid-part1",{"title":1553,"path":1554,"stem":1555},"DataGrid — сортування, фільтрація, редагування","/csharp/desktop-ui/datagrid-part2","01.csharp/12.desktop-ui/32.datagrid-part2",{"title":1557,"path":1558,"stem":1559},"TreeView та GridView","/csharp/desktop-ui/treeview-listview","01.csharp/12.desktop-ui/33.treeview-listview",{"title":1561,"path":1562,"stem":1563},"Меню, Toolbar, ContextMenu, StatusBar","/csharp/desktop-ui/menus-toolbars","01.csharp/12.desktop-ui/34.menus-toolbars",{"title":1565,"path":1566,"stem":1567},"Навігація та керування вікнами. Частина 1: вікна та сторінки","/csharp/desktop-ui/navigation-windows-part1","01.csharp/12.desktop-ui/35.navigation-windows-part1",{"title":1569,"path":1570,"stem":1571},"Навігація та керування вікнами. Частина 2: MVVM-навігація","/csharp/desktop-ui/navigation-windows-part2","01.csharp/12.desktop-ui/35.navigation-windows-part2",{"title":1573,"path":1574,"stem":1575},"Avalonia — Навігація та діалоги","/csharp/desktop-ui/35a.avalonia-navigation-dialogs","01.csharp/12.desktop-ui/35a.avalonia-navigation-dialogs",{"title":1577,"path":1578,"stem":1579},"Діалоги та File Pickers у WPF","/csharp/desktop-ui/dialogs-file-pickers","01.csharp/12.desktop-ui/36.dialogs-file-pickers",{"title":1581,"path":1582,"stem":1583},"UserControl: компонентний підхід у WPF","/csharp/desktop-ui/user-controls","01.csharp/12.desktop-ui/37.user-controls",{"title":1585,"path":1586,"stem":1587},"Custom Controls: Lookless Controls у WPF","/csharp/desktop-ui/custom-controls","01.csharp/12.desktop-ui/38.custom-controls",{"title":1589,"path":1590,"stem":1591},"Avalonia TemplatedControl — Lookless Controls","/csharp/desktop-ui/38a.avalonia-templated-controls","01.csharp/12.desktop-ui/38a.avalonia-templated-controls",{"title":1593,"path":1594,"stem":1595},"Анімації у WPF: Storyboard та Easing Functions","/csharp/desktop-ui/animations-transitions","01.csharp/12.desktop-ui/39.animations-transitions",{"title":1597,"path":1598,"stem":1599},"Анімації в Avalonia","/csharp/desktop-ui/39a.avalonia-animations","01.csharp/12.desktop-ui/39a.avalonia-animations",{"title":1601,"path":1602,"stem":1603},"2D Графіка та Мультимедіа у WPF","/csharp/desktop-ui/media-graphics","01.csharp/12.desktop-ui/40.media-graphics",{"title":1605,"path":1606,"stem":1607},"Dependency Injection у WPF та Avalonia","/csharp/desktop-ui/di-integration","01.csharp/12.desktop-ui/41.di-integration",{"title":1609,"path":1610,"stem":1611},"SQLite та EF Core у десктопних додатках","/csharp/desktop-ui/data-persistence-part1","01.csharp/12.desktop-ui/42.data-persistence-part1",{"title":1613,"path":1614,"stem":1615},"Repository Pattern та Unit of Work","/csharp/desktop-ui/data-persistence-part2","01.csharp/12.desktop-ui/43.data-persistence-part2",{"title":1617,"path":1618,"stem":1619},"Тестування ViewModels","/csharp/desktop-ui/viewmodel-testing","01.csharp/12.desktop-ui/44.viewmodel-testing",{"title":1621,"path":1622,"stem":1623},"Avalonia Headless Testing — тестування UI без вікон","/csharp/desktop-ui/44a.avalonia-headless-testing","01.csharp/12.desktop-ui/44a.avalonia-headless-testing",{"title":1625,"path":1626,"stem":1627},"Кросплатформна розробка з Avalonia","/csharp/desktop-ui/avalonia-cross-platform","01.csharp/12.desktop-ui/45.avalonia-cross-platform",{"title":1629,"path":1630,"stem":1631},"Пакування та розгортання Avalonia додатків","/csharp/desktop-ui/avalonia-packaging-deployment","01.csharp/12.desktop-ui/46.avalonia-packaging-deployment",{"title":1633,"path":1634,"stem":1635},"Розгортання WPF застосунків","/csharp/desktop-ui/wpf-packaging-deployment","01.csharp/12.desktop-ui/47.wpf-packaging-deployment",{"title":1637,"path":1638,"stem":1639},"C# & .NET: The Ultimate Roadmap","/csharp/roadmap","01.csharp/roadmap",{"title":1641,"icon":1642,"path":1643,"stem":1644,"children":1645,"page":59},"C++","i-devicon-cplusplus","/cpp","02.cpp",[1646,1650,1654,1658,1662,1666,1670,1674,1678,1681,1685,1689,1693,1697,1701,1705,1709,1713,1717,1721,1725,1729,1733,1737,1741,1745,1749,1753,1757,1761],{"title":1647,"path":1648,"stem":1649},"Вступ у програмування та алгоритми","/cpp/intro-algorithms","02.cpp/01.intro-algorithms",{"title":1651,"path":1652,"stem":1653},"Code Style: угоди про оформлення коду","/cpp/code-style","02.cpp/02.code-style",{"title":1655,"path":1656,"stem":1657},"Середовище розробки та перший проєкт","/cpp/ide-setup","02.cpp/03.ide-setup",{"title":1659,"path":1660,"stem":1661},"Вивід даних на екран","/cpp/data-output","02.cpp/04.data-output",{"title":1663,"path":1664,"stem":1665},"Типи даних, змінні та константи","/cpp/data-types-variables","02.cpp/05.data-types-variables",{"title":1667,"path":1668,"stem":1669},"Ввід даних з клавіатури","/cpp/data-input","02.cpp/06.data-input",{"title":1671,"path":1672,"stem":1673},"Оператори, перетворення типів та логічні операції","/cpp/operators-type-conversion","02.cpp/07.operators-type-conversion",{"title":1675,"path":1676,"stem":1677},"Цикли","/cpp/loops","02.cpp/08.loops",{"title":32,"path":1679,"stem":1680},"/cpp/arrays","02.cpp/09.arrays",{"title":1682,"path":1683,"stem":1684},"Алгоритми сортування та аналіз складності","/cpp/sorting","02.cpp/10.sorting",{"title":1686,"path":1687,"stem":1688},"Алгоритми пошуку","/cpp/searching","02.cpp/11.searching",{"title":1690,"path":1691,"stem":1692},"Функції: основи","/cpp/functions-basics","02.cpp/12.functions-basics",{"title":1694,"path":1695,"stem":1696},"Функції: прототипи, область видимості та додаткові можливості","/cpp/functions-scope","02.cpp/13.functions-scope",{"title":1698,"path":1699,"stem":1700},"Функції: перевантаження та шаблони","/cpp/functions-overloading-templates","02.cpp/14.functions-overloading-templates",{"title":1702,"path":1703,"stem":1704},"Вказівники: основи","/cpp/pointers-basics","02.cpp/15.pointers-basics",{"title":1706,"path":1707,"stem":1708},"Посилання (References)","/cpp/references","02.cpp/16.references",{"title":1710,"path":1711,"stem":1712},"Вказівники, const і масиви","/cpp/pointers-const-arrays","02.cpp/17.pointers-const-arrays",{"title":1714,"path":1715,"stem":1716},"Адресна арифметика","/cpp/pointer-arithmetic","02.cpp/18.pointer-arithmetic",{"title":1718,"path":1719,"stem":1720},"Динамічна пам'ять","/cpp/dynamic-memory","02.cpp/19.dynamic-memory",{"title":1722,"path":1723,"stem":1724},"Вказівники типу void","/cpp/void-pointers","02.cpp/20.void-pointers",{"title":1726,"path":1727,"stem":1728},"Вказівники на вказівники","/cpp/pointers-to-pointers","02.cpp/21.pointers-to-pointers",{"title":1730,"path":1731,"stem":1732},"Оператор доступу до членів через вказівник (->)","/cpp/member-access-operator","02.cpp/22.member-access-operator",{"title":1734,"path":1735,"stem":1736},"Цикл for-each (Range-based for)","/cpp/foreach-loop","02.cpp/23.foreach-loop",{"title":1738,"path":1739,"stem":1740},"Вказівники на функції","/cpp/function-pointers","02.cpp/24.function-pointers",{"title":1742,"path":1743,"stem":1744},"Лямбда-вирази","/cpp/lambdas","02.cpp/25.lambdas",{"title":1746,"path":1747,"stem":1748},"Лямбда-захоплення","/cpp/lambda-captures","02.cpp/26.lambda-captures",{"title":1750,"path":1751,"stem":1752},"Еліпсис","/cpp/ellipsis","02.cpp/27.ellipsis",{"title":1754,"path":1755,"stem":1756},"Аргументи командного рядка","/cpp/command-line-arguments","02.cpp/28.command-line-arguments",{"title":1758,"path":1759,"stem":1760},"Перерахування (enum)","/cpp/enum","02.cpp/29.enum",{"title":1762,"path":1763,"stem":1764},"План навчання: Курс C++ — Продовження (Статті 29–60+)","/cpp/curriculum-plan","02.cpp/curriculum-plan",{"title":1766,"icon":1767,"path":1768,"stem":1769,"children":1770,"page":59},"JavaScript","i-devicon-javascript","/javascript","03.javascript",[1771,1797,1851,1873,2177,2215],{"title":1772,"icon":1773,"path":1774,"stem":1775,"children":1776,"page":59},"Events","i-lucide-mouse-pointer-click","/javascript/events","03.javascript/01.events",[1777,1781,1785,1789,1793],{"title":1778,"path":1779,"stem":1780},"Вступ до подій браузера","/javascript/events/intro","03.javascript/01.events/01.intro",{"title":1782,"path":1783,"stem":1784},"Бульбашковий механізм (Bubbling) та занурення (Capturing)","/javascript/events/bubbling-capturing","03.javascript/01.events/02.bubbling-capturing",{"title":1786,"path":1787,"stem":1788},"Делегування подій (Event Delegation)","/javascript/events/delegate-events","03.javascript/01.events/03.delegate-events",{"title":1790,"path":1791,"stem":1792},"Типові дії браузера та preventDefault()","/javascript/events/prevent-default","03.javascript/01.events/04.prevent-default",{"title":1794,"path":1795,"stem":1796},"Запуск користувацьких подій (Custom Events)","/javascript/events/custom-events","03.javascript/01.events/05.custom-events",{"title":1798,"icon":1799,"path":1800,"stem":1801,"children":1802,"page":59},"Network","i-lucide-globe","/javascript/network","03.javascript/02.network",[1803,1807,1811,1815,1819,1823,1827,1831,1835,1839,1843,1847],{"title":1804,"path":1805,"stem":1806},"Fetch API - Сучасний підхід до HTTP-запитів","/javascript/network/01-fetch-api","03.javascript/02.network/01-fetch-api",{"title":1808,"path":1809,"stem":1810},"FormData - Робота з формами та файлами","/javascript/network/02-formdata","03.javascript/02.network/02-formdata",{"title":1812,"path":1813,"stem":1814},"Відстеження прогресу завантаження","/javascript/network/03-download-progress","03.javascript/02.network/03-download-progress",{"title":1816,"path":1817,"stem":1818},"Переривання fetch-запитів","/javascript/network/04-abort-requests","03.javascript/02.network/04-abort-requests",{"title":1820,"path":1821,"stem":1822},"CORS - Запити між різними джерелами","/javascript/network/05-cors","03.javascript/02.network/05-cors",{"title":1824,"path":1825,"stem":1826},"Fetch API - Повний довідник опцій","/javascript/network/06-fetch-options","03.javascript/02.network/06-fetch-options",{"title":1828,"path":1829,"stem":1830},"URL Objects - Робота з посиланнями","/javascript/network/07-url-objects","03.javascript/02.network/07-url-objects",{"title":1832,"path":1833,"stem":1834},"XMLHttpRequest - AJAX та низькорівневі запити","/javascript/network/08-xmlhttprequest","03.javascript/02.network/08-xmlhttprequest",{"title":1836,"path":1837,"stem":1838},"Відновлюване завантаження файлів","/javascript/network/09-resumable-upload","03.javascript/02.network/09-resumable-upload",{"title":1840,"path":1841,"stem":1842},"Cookies, document.cookie та світ після \"Cookiepocalypse\"","/javascript/network/10-cookies","03.javascript/02.network/10-cookies",{"title":1844,"path":1845,"stem":1846},"js-cookie: Керування Cookies без Болю","/javascript/network/11-js-cookie","03.javascript/02.network/11-js-cookie",{"title":1848,"path":1849,"stem":1850},"Axios: Потужний HTTP-клієнт для JavaScript","/javascript/network/12-axios","03.javascript/02.network/12-axios",{"title":1852,"icon":1853,"path":1854,"stem":1855,"children":1856,"page":59},"Bom","i-lucide-monitor","/javascript/bom","03.javascript/03.bom",[1857,1861,1865,1869],{"title":1858,"path":1859,"stem":1860},"LocalStorage, SessionStorage та patterns збереження даних","/javascript/bom/01-localstorage","03.javascript/03.bom/01-localstorage",{"title":1862,"path":1863,"stem":1864},"Location Object - Керування адресою сторінки","/javascript/bom/02-location-object","03.javascript/03.bom/02-location-object",{"title":1866,"path":1867,"stem":1868},"History API - Керування історією браузера","/javascript/bom/03-history-api","03.javascript/03.bom/03-history-api",{"title":1870,"path":1871,"stem":1872},"Navigator Object - Ідентифікація та Можливості Пристрою","/javascript/bom/04-navigator-object","03.javascript/03.bom/04-navigator-object",{"title":1874,"icon":1875,"path":1876,"stem":1877,"children":1878},"React","i-devicon-react","/javascript/react","03.javascript/04.react/index",[1879,1880,1884,1888,1892,1896,1959,1994,2146],{"title":1874,"path":1876,"stem":1877},{"title":1881,"path":1882,"stem":1883},"Робота з Формами в React","/javascript/react/react-forms","03.javascript/04.react/01.react-forms",{"title":1885,"path":1886,"stem":1887},"React Hook Form: Професійна Робота з Формами","/javascript/react/react-hook-form","03.javascript/04.react/02.react-hook-form",{"title":1889,"path":1890,"stem":1891},"React Hook Form: Глибоке Розуміння Архітектури та Оптимізації","/javascript/react/react-hook-form-new","03.javascript/04.react/02.react-hook-form-new",{"title":1893,"path":1894,"stem":1895},"Axios та React: Професійна Архітектура Запитів","/javascript/react/data-fetching-axios","03.javascript/04.react/03.data-fetching-axios",{"title":1897,"icon":132,"path":1898,"stem":1899,"children":1900},"Tanstack Query","/javascript/react/tanstack-query","03.javascript/04.react/04.tanstack-query/index",[1901,1903,1907,1911,1915,1919,1923,1927,1931,1935,1939,1943,1947,1951,1955],{"title":1902,"path":1898,"stem":1899},"TanStack Query: Майстерність Керування Станом Сервера",{"title":1904,"path":1905,"stem":1906},"Парадигма Server State: Чому useEffect недостатньо","/javascript/react/tanstack-query/server-state-paradigm","03.javascript/04.react/04.tanstack-query/01.server-state-paradigm",{"title":1908,"path":1909,"stem":1910},"Встановлення та Налаштування: Фундамент","/javascript/react/tanstack-query/installation-and-devtools","03.javascript/04.react/04.tanstack-query/02.installation-and-devtools",{"title":1912,"path":1913,"stem":1914},"Основи Запитів та Магія Ключів","/javascript/react/tanstack-query/query-basics-and-keys","03.javascript/04.react/04.tanstack-query/03.query-basics-and-keys",{"title":1916,"path":1917,"stem":1918},"Синхронізація Даних: Життєвий Цикл Запиту","/javascript/react/tanstack-query/data-synchronization","03.javascript/04.react/04.tanstack-query/04.data-synchronization",{"title":1920,"path":1921,"stem":1922},"Мутації та Інвалідація: Зміна Даних","/javascript/react/tanstack-query/mutations-and-invalidation","03.javascript/04.react/04.tanstack-query/05.mutations-and-invalidation",{"title":1924,"path":1925,"stem":1926},"Оптимістичні Оновлення: Швидше за Світло","/javascript/react/tanstack-query/optimistic-updates","03.javascript/04.react/04.tanstack-query/06.optimistic-updates",{"title":1928,"path":1929,"stem":1930},"Пагінація та Infinite Scroll","/javascript/react/tanstack-query/pagination-and-load-more","03.javascript/04.react/04.tanstack-query/07.pagination-and-load-more",{"title":1932,"path":1933,"stem":1934},"Просунуті Патерни та Оптимізація","/javascript/react/tanstack-query/advanced-patterns","03.javascript/04.react/04.tanstack-query/08.advanced-patterns",{"title":1936,"path":1937,"stem":1938},"Архітектура та Best Practices","/javascript/react/tanstack-query/architecture-and-best-practices","03.javascript/04.react/04.tanstack-query/09.architecture-and-best-practices",{"title":1940,"path":1941,"stem":1942},"Server-Side Rendering (SSR) та Гідратація","/javascript/react/tanstack-query/server-side-rendering","03.javascript/04.react/04.tanstack-query/10.server-side-rendering",{"title":1944,"path":1945,"stem":1946},"Стратегії Тестування","/javascript/react/tanstack-query/testing-strategies","03.javascript/04.react/04.tanstack-query/11.testing-strategies",{"title":1948,"path":1949,"stem":1950},"Аутентифікація та Обробка Помилок","/javascript/react/tanstack-query/authentication-and-errors","03.javascript/04.react/04.tanstack-query/12.authentication-and-errors",{"title":1952,"path":1953,"stem":1954},"React Suspense та Майбутнє","/javascript/react/tanstack-query/react-suspense","03.javascript/04.react/04.tanstack-query/13.react-suspense",{"title":1956,"path":1957,"stem":1958},"Глибоке Занурення в Продуктивність","/javascript/react/tanstack-query/performance-deep-dive","03.javascript/04.react/04.tanstack-query/14.performance-deep-dive",{"title":1960,"icon":1875,"path":1961,"stem":1962,"children":1963},"React Router","/javascript/react/react-router","03.javascript/04.react/05.react-router/index",[1964,1966,1970,1974,1978,1982,1986,1990],{"title":1965,"path":1961,"stem":1962},"React Router: Навігаційна система сучасного вебу",{"title":1967,"path":1968,"stem":1969},"Налаштування та Базовий Роутинг","/javascript/react/react-router/setup-and-basic-routing","03.javascript/04.react/05.react-router/01.setup-and-basic-routing",{"title":1971,"path":1972,"stem":1973},"Динамічна Навігація","/javascript/react/react-router/navigation-and-links","03.javascript/04.react/05.react-router/02.navigation-and-links",{"title":1975,"path":1976,"stem":1977},"Вкладені Маршрути та Макети","/javascript/react/react-router/nested-routes-and-layouts","03.javascript/04.react/05.react-router/03.nested-routes-and-layouts",{"title":1979,"path":1980,"stem":1981},"Динамічні Маршрути та Параметри","/javascript/react/react-router/dynamic-routing","03.javascript/04.react/05.react-router/04.dynamic-routing",{"title":1983,"path":1984,"stem":1985},"Data APIs: Loaders та Actions","/javascript/react/react-router/data-loading","03.javascript/04.react/05.react-router/05.data-loading",{"title":1987,"path":1988,"stem":1989},"Просунуті Патерни","/javascript/react/react-router/advanced-patterns","03.javascript/04.react/05.react-router/06.advanced-patterns",{"title":1991,"path":1992,"stem":1993},"Legacy Routing: Компонентний підхід","/javascript/react/react-router/legacy-routing","03.javascript/04.react/05.react-router/07.legacy-routing",{"title":1995,"icon":132,"path":1996,"stem":1997,"children":1998},"Redux","/javascript/react/redux","03.javascript/04.react/06.redux/index",[1999,2001,2017,2046,2055,2076,2092,2121],{"title":2000,"path":1996,"stem":1997},"Redux: Еволюція управління станом",{"title":14,"icon":15,"path":2002,"stem":2003,"children":2004,"page":59},"/javascript/react/redux/fundamentals","03.javascript/04.react/06.redux/01.fundamentals",[2005,2009,2013],{"title":2006,"path":2007,"stem":2008},"Вступ до State Management","/javascript/react/redux/fundamentals/intro-state-management","03.javascript/04.react/06.redux/01.fundamentals/01.intro-state-management",{"title":2010,"path":2011,"stem":2012},"Філософія Redux та Три Принципи","/javascript/react/redux/fundamentals/redux-philosophy","03.javascript/04.react/06.redux/01.fundamentals/02.redux-philosophy",{"title":2014,"path":2015,"stem":2016},"Чисті функції та Іммутабельність","/javascript/react/redux/fundamentals/pure-functions-immutability","03.javascript/04.react/06.redux/01.fundamentals/03.pure-functions-immutability",{"title":2018,"icon":132,"path":2019,"stem":2020,"children":2021,"page":59},"Classic Redux","/javascript/react/redux/classic-redux","03.javascript/04.react/06.redux/02.classic-redux",[2022,2026,2030,2034,2038,2042],{"title":2023,"path":2024,"stem":2025},"Створення Store (Classic Redux)","/javascript/react/redux/classic-redux/store-setup","03.javascript/04.react/06.redux/02.classic-redux/01.store-setup",{"title":2027,"path":2028,"stem":2029},"Actions, Constants та Action Creators","/javascript/react/redux/classic-redux/actions-constants","03.javascript/04.react/06.redux/02.classic-redux/02.actions-constants",{"title":2031,"path":2032,"stem":2033},"Логіка Reducers","/javascript/react/redux/classic-redux/reducers","03.javascript/04.react/06.redux/02.classic-redux/03.reducers",{"title":2035,"path":2036,"stem":2037},"Комбінування Reducers (Root Reducer)","/javascript/react/redux/classic-redux/data-flow","03.javascript/04.react/06.redux/02.classic-redux/04.data-flow",{"title":2039,"path":2040,"stem":2041},"Підключення до React (React-Redux)","/javascript/react/redux/classic-redux/react-redux-connection","03.javascript/04.react/06.redux/02.classic-redux/05.react-redux-connection",{"title":2043,"path":2044,"stem":2045},"Middleware та Асинхронність (Redux Thunk)","/javascript/react/redux/classic-redux/middleware-thunk","03.javascript/04.react/06.redux/02.classic-redux/06.middleware-thunk",{"title":2047,"icon":132,"path":2048,"stem":2049,"children":2050,"page":59},"Transition To Rtk","/javascript/react/redux/transition-to-rtk","03.javascript/04.react/06.redux/03.transition-to-rtk",[2051],{"title":2052,"path":2053,"stem":2054},"Проблеми класичного Redux","/javascript/react/redux/transition-to-rtk/problems-with-classic","03.javascript/04.react/06.redux/03.transition-to-rtk/01.problems-with-classic",{"title":2056,"icon":132,"path":2057,"stem":2058,"children":2059,"page":59},"Redux Toolkit","/javascript/react/redux/redux-toolkit","03.javascript/04.react/06.redux/04.redux-toolkit",[2060,2064,2068,2072],{"title":2061,"path":2062,"stem":2063},"Налаштування Store з configureStore","/javascript/react/redux/redux-toolkit/configure-store","03.javascript/04.react/06.redux/04.redux-toolkit/01.configure-store",{"title":2065,"path":2066,"stem":2067},"createSlice: Революція в Redux","/javascript/react/redux/redux-toolkit/create-slice","03.javascript/04.react/06.redux/04.redux-toolkit/02.create-slice",{"title":2069,"path":2070,"stem":2071},"Асинхронність з createAsyncThunk","/javascript/react/redux/redux-toolkit/async-thunks","03.javascript/04.react/06.redux/04.redux-toolkit/03.async-thunks",{"title":2073,"path":2074,"stem":2075},"04. Entity Adapter: Керування нормалізованим станом","/javascript/react/redux/redux-toolkit/entity-adapter","03.javascript/04.react/06.redux/04.redux-toolkit/04.entity-adapter",{"title":2077,"icon":92,"path":2078,"stem":2079,"children":2080,"page":59},"Advanced","/javascript/react/redux/advanced","03.javascript/04.react/06.redux/05.advanced",[2081,2085,2089],{"title":2082,"path":2083,"stem":2084},"Мемоізація та Селектори: Повний Гайд по Reselect","/javascript/react/redux/advanced/selectors-reselect","03.javascript/04.react/06.redux/05.advanced/01.selectors-reselect",{"title":2086,"path":2087,"stem":2088},"RTK Query: Архітектура Серверного Кешу","/javascript/react/redux/advanced/rtk-query-intro","03.javascript/04.react/06.redux/05.advanced/02.rtk-query-intro",{"title":1936,"path":2090,"stem":2091},"/javascript/react/redux/advanced/architecture-best-practices","03.javascript/04.react/06.redux/05.advanced/03.architecture-best-practices",{"title":2093,"icon":132,"path":2094,"stem":2095,"children":2096,"page":59},"Project Kanban","/javascript/react/redux/project-kanban","03.javascript/04.react/06.redux/06.project-kanban",[2097,2101,2105,2109,2113,2117],{"title":2098,"path":2099,"stem":2100},"Проєкт: Kanban Board (Trello Clone)","/javascript/react/redux/project-kanban/project-overview","03.javascript/04.react/06.redux/06.project-kanban/01.project-overview",{"title":2102,"path":2103,"stem":2104},"Налаштування та Типізація","/javascript/react/redux/project-kanban/setup-and-types","03.javascript/04.react/06.redux/06.project-kanban/02.setup-and-types",{"title":2106,"path":2107,"stem":2108},"Board Slice: Серце Дошки","/javascript/react/redux/project-kanban/board-slice","03.javascript/04.react/06.redux/06.project-kanban/03.board-slice",{"title":2110,"path":2111,"stem":2112},"Логіка Drag & Drop","/javascript/react/redux/project-kanban/drag-and-drop-logic","03.javascript/04.react/06.redux/06.project-kanban/04.drag-and-drop-logic",{"title":2114,"path":2115,"stem":2116},"Інтеграція з RTK Query","/javascript/react/redux/project-kanban/rtk-query-integration","03.javascript/04.react/06.redux/06.project-kanban/05.rtk-query-integration",{"title":2118,"path":2119,"stem":2120},"Optimistic Updates","/javascript/react/redux/project-kanban/optimistic-updates","03.javascript/04.react/06.redux/06.project-kanban/06.optimistic-updates",{"title":2122,"icon":132,"path":2123,"stem":2124,"children":2125,"page":59},"Testing","/javascript/react/redux/testing","03.javascript/04.react/06.redux/07.testing",[2126,2130,2134,2138,2142],{"title":2127,"path":2128,"stem":2129},"Тестування Redux","/javascript/react/redux/testing/intro-testing","03.javascript/04.react/06.redux/07.testing/01.intro-testing",{"title":2131,"path":2132,"stem":2133},"Тестування Reducers","/javascript/react/redux/testing/testing-reducers","03.javascript/04.react/06.redux/07.testing/02.testing-reducers",{"title":2135,"path":2136,"stem":2137},"Тестування Селекторів","/javascript/react/redux/testing/testing-selectors","03.javascript/04.react/06.redux/07.testing/03.testing-selectors",{"title":2139,"path":2140,"stem":2141},"Тестування Компонентів (Integration)","/javascript/react/redux/testing/testing-components","03.javascript/04.react/06.redux/07.testing/04.testing-components",{"title":2143,"path":2144,"stem":2145},"Тестування Async Thunks","/javascript/react/redux/testing/testing-thunks","03.javascript/04.react/06.redux/07.testing/05.testing-thunks",{"title":2147,"icon":132,"path":2148,"stem":2149,"children":2150},"Ui Libraries","/javascript/react/ui-libraries","03.javascript/04.react/07.ui-libraries/index",[2151,2153,2157,2161,2165,2169,2173],{"title":2152,"path":2148,"stem":2149},"UI Бібліотеки в React",{"title":2154,"path":2155,"stem":2156},"Вступ до UI Бібліотек: Навіщо Винаходити Велосипед Двічі?","/javascript/react/ui-libraries/introduction-to-ui-libraries","03.javascript/04.react/07.ui-libraries/01.introduction-to-ui-libraries",{"title":2158,"path":2159,"stem":2160},"Філософія shadcn/ui: \"Not a Component Library\"","/javascript/react/ui-libraries/shadcn-philosophy","03.javascript/04.react/07.ui-libraries/02.shadcn-philosophy",{"title":2162,"path":2163,"stem":2164},"Установка та Налаштування shadcn/ui","/javascript/react/ui-libraries/shadcn-installation","03.javascript/04.react/07.ui-libraries/03.shadcn-installation",{"title":2166,"path":2167,"stem":2168},"Базові Компоненти shadcn/ui: Фундамент Інтерфейсу","/javascript/react/ui-libraries/shadcn-components-basics","03.javascript/04.react/07.ui-libraries/04.shadcn-components-basics",{"title":2170,"path":2171,"stem":2172},"Компоненти Форм: Побудова Інтерактивних Form","/javascript/react/ui-libraries/shadcn-components-forms","03.javascript/04.react/07.ui-libraries/05.shadcn-components-forms",{"title":2174,"path":2175,"stem":2176},"Складні Компоненти: Dialog, Dropdown, Table та Command","/javascript/react/ui-libraries/shadcn-components-advanced","03.javascript/04.react/07.ui-libraries/06.shadcn-components-advanced",{"title":2178,"icon":2179,"path":2180,"stem":2181,"children":2182,"page":59},"TypeScript","i-devicon-typescript","/javascript/typescript","03.javascript/05.typescript",[2183,2187,2191,2195,2199,2203,2207,2211],{"title":2184,"path":2185,"stem":2186},"TypeScript: Броня для вашого коду","/javascript/typescript/intro-and-basic-types","03.javascript/05.typescript/01.intro-and-basic-types",{"title":2188,"path":2189,"stem":2190},"Майстерність Моделювання Даних: Інтерфейси та Просунуті Типи","/javascript/typescript/interfaces-and-advanced-types","03.javascript/05.typescript/02.interfaces-and-advanced-types",{"title":2192,"path":2193,"stem":2194},"Алхімія Типів: Generics та Utility Types","/javascript/typescript/generics-and-utilities","03.javascript/05.typescript/03.generics-and-utilities",{"title":2196,"path":2197,"stem":2198},"Архітектура та Шаблони: Класи в TypeScript","/javascript/typescript/classes-and-oop","03.javascript/05.typescript/04.classes-and-oop",{"title":2200,"path":2201,"stem":2202},"Продакшн та Екосистема: Advanced Config & Workflow","/javascript/typescript/advanced-patterns-and-config","03.javascript/05.typescript/05.advanced-patterns-and-config",{"title":2204,"path":2205,"stem":2206},"TypeScript у світі React","/javascript/typescript/react-basics","03.javascript/05.typescript/06.react-basics",{"title":2208,"path":2209,"stem":2210},"React + TypeScript: Продвинуті патерни","/javascript/typescript/react-advanced","03.javascript/05.typescript/07.react-advanced",{"title":2212,"path":2213,"stem":2214},"React + TypeScript: Екосистема та бібліотеки","/javascript/typescript/react-ecosystem","03.javascript/05.typescript/08.react-ecosystem",{"title":2216,"path":2217,"stem":2218},"Atomic Design","/javascript/atomic-design","03.javascript/2.atomic-design",{"title":2220,"icon":2221,"path":2222,"stem":2223,"children":2224,"page":59},"Java","i-devicon-java","/java","04.java",[2225,2228,2231,2235,2239,2243,2247],{"title":162,"path":2226,"stem":2227},"/java/data-mapper-part1","04.java/01.data-mapper-part1",{"title":166,"path":2229,"stem":2230},"/java/data-mapper-part2","04.java/02.data-mapper-part2",{"title":2232,"path":2233,"stem":2234},"Service Layer: Організація бізнес-логіки","/java/service-layer","04.java/03.service-layer",{"title":2236,"path":2237,"stem":2238},"Rich Domain Model та State Pattern","/java/rich-domain-model","04.java/04.rich-domain-model",{"title":2240,"path":2241,"stem":2242},"Патерни для складної бізнес-логіки","/java/business-logic-patterns","04.java/05.business-logic-patterns",{"title":2244,"path":2245,"stem":2246},"Обробка помилок та валідація","/java/error-handling-validation","04.java/06.error-handling-validation",{"title":2248,"path":2249,"stem":2250,"children":2251,"page":59},"Проектування баз даних","/java/pr2","04.java/pr2",[2252,2256,2260,2264,2268,2272,2276,2280,2284,2288,2292,2296,2300,2304,2308,2312,2316,2320,2324,2328,2332,2336,2340,2344,2348],{"title":2253,"path":2254,"stem":2255},"Концептуальне моделювання: Мистецтво розуміння предметної області","/java/pr2/conceptual-modeling","04.java/pr2/01.conceptual-modeling",{"title":2257,"path":2258,"stem":2259},"Логічне моделювання: Від бізнес-ідей до структур даних","/java/pr2/logical-modeling","04.java/pr2/02.logical-modeling",{"title":2261,"path":2262,"stem":2263},"Нормалізація: Гігієна даних та боротьба з аномаліями","/java/pr2/normalization","04.java/pr2/03.normalization",{"title":2265,"path":2266,"stem":2267},"Фізична схема: Від абстракції до DDL","/java/pr2/physical-schema","04.java/pr2/04.physical-schema",{"title":2269,"path":2270,"stem":2271},"Архітектурна класифікація таблиць","/java/pr2/table-classification","04.java/pr2/05.table-classification",{"title":2273,"path":2274,"stem":2275},"Database Migrations: Версіонування схеми з Flyway","/java/pr2/database-migrations","04.java/pr2/06.database-migrations",{"title":2277,"path":2278,"stem":2279},"А що, якби це була не реляційна БД?","/java/pr2/beyond-relational","04.java/pr2/07.beyond-relational",{"title":2281,"path":2282,"stem":2283},"Object-Relational Impedance Mismatch: Два світи, що не хочуть дружити","/java/pr2/impedance-mismatch","04.java/pr2/09.impedance-mismatch",{"title":2285,"path":2286,"stem":2287},"JDBC: Перший контакт із базою даних","/java/pr2/jdbc-fundamentals","04.java/pr2/10.jdbc-fundamentals",{"title":2289,"path":2290,"stem":2291},"Якість коду: Spotless, SpotBugs та SonarQube","/java/pr2/10a.code-quality","04.java/pr2/10a.code-quality",{"title":2293,"path":2294,"stem":2295},"Connection Pool: Патерн Object Pool для JDBC-з'єднань","/java/pr2/connection-pool","04.java/pr2/11.connection-pool",{"title":2297,"path":2298,"stem":2299},"Row Data Gateway: Об'єкт як обгортка рядка таблиці","/java/pr2/row-data-gateway","04.java/pr2/12.row-data-gateway",{"title":2301,"path":2302,"stem":2303},"Table Data Gateway: Фасад таблиці як архітектурний відступ","/java/pr2/table-data-gateway","04.java/pr2/13.table-data-gateway",{"title":2305,"path":2306,"stem":2307},"Repository + Data Mapper: Правильна шарова архітектура з JDBC","/java/pr2/repository-data-mapper","04.java/pr2/14.repository-data-mapper",{"title":2309,"path":2310,"stem":2311},"Identity Map: Кешування сутностей у рамках сесії","/java/pr2/identity-map","04.java/pr2/15.identity-map",{"title":2313,"path":2314,"stem":2315},"Unit of Work: Відстеження змін і координація JDBC-транзакцій","/java/pr2/unit-of-work","04.java/pr2/16.unit-of-work",{"title":2317,"path":2318,"stem":2319},"Strategy: Замінювані SQL-стратегії для підтримки різних СУБД","/java/pr2/strategy-sql","04.java/pr2/17.strategy-sql",{"title":2321,"path":2322,"stem":2323},"Proxy: Lazy Loading для One-To-Many колекцій","/java/pr2/proxy-lazy-loading","04.java/pr2/18.proxy-lazy-loading",{"title":2325,"path":2326,"stem":2327},"Generic Repository через Java Reflection: анотації та динамічний SQL","/java/pr2/generic-repository-reflection","04.java/pr2/19.generic-repository-reflection",{"title":2329,"path":2330,"stem":2331},"Specification Pattern: Композиція бізнес-правил для складних запитів","/java/pr2/specification-pattern","04.java/pr2/20.specification-pattern",{"title":2333,"path":2334,"stem":2335},"Розширені можливості Specification Pattern: підзапити, агрегації та гібридний підхід","/java/pr2/20a.advanced-specifications","04.java/pr2/20a.advanced-specifications",{"title":2337,"path":2338,"stem":2339},"Асинхронність у JDBC: Від блокуючих викликів до CompletableFuture","/java/pr2/asynchronous-jdbc","04.java/pr2/21.asynchronous-jdbc",{"title":2341,"path":2342,"stem":2343},"Інтеграційне тестування JDBC-репозиторіїв: Embedded H2 та патерн AAA","/java/pr2/integration-testing-h2","04.java/pr2/22.integration-testing-h2",{"title":2345,"path":2346,"stem":2347},"Testcontainers: Тестування з реальною PostgreSQL у Docker-контейнерах","/java/pr2/integration-testing-testcontainers","04.java/pr2/23.integration-testing-testcontainers",{"title":2349,"path":2350,"stem":2351},"Модуль \"Проектування реляційних баз даних\" для 04.java/pr2","/java/pr2/implementation_plan","04.java/pr2/implementation_plan",{"title":2353,"icon":2354,"path":2355,"stem":2356,"children":2357,"page":59},"Бази даних","i-lucide-database","/databases","06.databases",[2358,2388,2411,2448,2477,2495,2529,2541,2550],{"title":2359,"icon":2360,"path":2361,"stem":2362,"children":2363,"page":59},"Intro","i-lucide-play","/databases/intro","06.databases/01.intro",[2364,2368,2372,2376,2380,2384],{"title":2365,"path":2366,"stem":2367},"Введення в теорію баз даних","/databases/intro/introduction-to-databases","06.databases/01.intro/01.introduction-to-databases",{"title":2369,"path":2370,"stem":2371},"Реляційна модель даних","/databases/intro/relational-model-theory","06.databases/01.intro/02.relational-model-theory",{"title":2373,"path":2374,"stem":2375},"ER-моделювання","/databases/intro/er-modeling","06.databases/01.intro/03.er-modeling",{"title":2377,"path":2378,"stem":2379},"Логічне проектування БД","/databases/intro/logical-schema","06.databases/01.intro/04.logical-schema",{"title":2381,"path":2382,"stem":2383},"Класифікація таблиць","/databases/intro/table-classification","06.databases/01.intro/05.table-classification",{"title":2385,"path":2386,"stem":2387},"PlantUML для баз даних","/databases/intro/plantuml-diagrams","06.databases/01.intro/06.plantuml-diagrams",{"title":2389,"icon":2354,"path":2390,"stem":2391,"children":2392,"page":59},"MS SQL Server Start","/databases/ms-sql-server-start","06.databases/02.ms-sql-server-start",[2393,2397,2403,2407],{"title":2394,"path":2395,"stem":2396},"Типи даних у MS SQL Server","/databases/ms-sql-server-start/data-types","06.databases/02.ms-sql-server-start/01.data-types",{"title":2398,"path":2399,"stem":2400,"children":2401},"Індекси у MS SQL Server","/databases/ms-sql-server-start/sql-indexes","06.databases/02.ms-sql-server-start/02.sql-indexes",[2402],{"title":2398,"path":2399,"stem":2400},{"title":2404,"path":2405,"stem":2406},"Системні бази даних MS SQL Server","/databases/ms-sql-server-start/system-databases","06.databases/02.ms-sql-server-start/03.system-databases",{"title":2408,"path":2409,"stem":2410},"Огляд мови SQL та запитів","/databases/ms-sql-server-start/sql-queries-overview","06.databases/02.ms-sql-server-start/04.sql-queries-overview",{"title":2412,"icon":2354,"path":2413,"stem":2414,"children":2415,"page":59},"SQL","/databases/sql","06.databases/03.sql",[2416,2420,2424,2428,2432,2436,2440,2444],{"title":2417,"path":2418,"stem":2419},"Налаштування демонстраційної бази даних","/databases/sql/sample-database-setup","06.databases/03.sql/00.sample-database-setup",{"title":2421,"path":2422,"stem":2423},"DDL - Створення таблиць (CREATE TABLE)","/databases/sql/ddl-create-table","06.databases/03.sql/01.ddl-create-table",{"title":2425,"path":2426,"stem":2427},"DDL - Зміна та видалення таблиць (ALTER, DROP)","/databases/sql/ddl-alter-drop-table","06.databases/03.sql/02.ddl-alter-drop-table",{"title":2429,"path":2430,"stem":2431},"SELECT запити - Основи","/databases/sql/select-queries-fundamentals","06.databases/03.sql/03.select-queries-fundamentals",{"title":2433,"path":2434,"stem":2435},"SELECT запити - Розширені можливості","/databases/sql/select-queries-advanced","06.databases/03.sql/04.select-queries-advanced",{"title":2437,"path":2438,"stem":2439},"INSERT запити - Додавання даних","/databases/sql/insert-queries","06.databases/03.sql/05.insert-queries",{"title":2441,"path":2442,"stem":2443},"UPDATE та DELETE запити","/databases/sql/update-delete-queries","06.databases/03.sql/06.update-delete-queries",{"title":2445,"path":2446,"stem":2447},"Транзакції в SQL","/databases/sql/transactions","06.databases/03.sql/07.transactions",{"title":2449,"icon":2354,"path":2450,"stem":2451,"children":2452,"page":59},"Multi Table Databases","/databases/multi-table-databases","06.databases/04.multi-table-databases",[2453,2457,2461,2465,2469,2473],{"title":2454,"path":2455,"stem":2456},"Зв'язки та нормалізація БД","/databases/multi-table-databases/relationships-and-normalization","06.databases/04.multi-table-databases/00.relationships-and-normalization",{"title":2458,"path":2459,"stem":2460},"INNER JOIN - З'єднання таблиць","/databases/multi-table-databases/inner-join","06.databases/04.multi-table-databases/01.inner-join",{"title":2462,"path":2463,"stem":2464},"OUTER JOINs - LEFT, RIGHT, FULL","/databases/multi-table-databases/outer-joins","06.databases/04.multi-table-databases/02.outer-joins",{"title":2466,"path":2467,"stem":2468},"CROSS та SELF JOINs","/databases/multi-table-databases/cross-self-joins","06.databases/04.multi-table-databases/03.cross-self-joins",{"title":2470,"path":2471,"stem":2472},"Підзапити (Subqueries)","/databases/multi-table-databases/subqueries","06.databases/04.multi-table-databases/04.subqueries",{"title":2474,"path":2475,"stem":2476},"Агрегації з JOIN","/databases/multi-table-databases/aggregations-with-joins","06.databases/04.multi-table-databases/05.aggregations-with-joins",{"title":2478,"icon":2479,"path":2480,"stem":2481,"children":2482,"page":59},"Aggregate Functions","i-lucide-calculator","/databases/aggregate-functions","06.databases/05.aggregate-functions",[2483,2487,2491],{"title":2484,"path":2485,"stem":2486},"Функції агрегування в MS SQL Server","/databases/aggregate-functions/introduction-aggregate-functions","06.databases/05.aggregate-functions/01.introduction-aggregate-functions",{"title":2488,"path":2489,"stem":2490},"Групування даних в MS SQL Server","/databases/aggregate-functions/grouping-data","06.databases/05.aggregate-functions/02.grouping-data",{"title":2492,"path":2493,"stem":2494},"Підзапити з агрегатними функціями","/databases/aggregate-functions/subqueries-aggregates","06.databases/05.aggregate-functions/03.subqueries-aggregates",{"title":2496,"icon":2497,"path":2498,"stem":2499,"children":2500,"page":59},"Тригери та зберігаємі процедури","i-lucide-database-zap","/databases/triggers-stored-procedures","06.databases/07.triggers-stored-procedures",[2501,2505,2509,2513,2517,2521,2525],{"title":2502,"path":2503,"stem":2504},"DML-тригери","/databases/triggers-stored-procedures/dml-triggers","06.databases/07.triggers-stored-procedures/01.dml-triggers",{"title":2506,"path":2507,"stem":2508},"DDL-тригери","/databases/triggers-stored-procedures/ddl-triggers","06.databases/07.triggers-stored-procedures/02.ddl-triggers",{"title":2510,"path":2511,"stem":2512},"Transact-SQL розширення","/databases/triggers-stored-procedures/transact-sql-extensions","06.databases/07.triggers-stored-procedures/03.transact-sql-extensions",{"title":2514,"path":2515,"stem":2516},"Транзакції","/databases/triggers-stored-procedures/transactions","06.databases/07.triggers-stored-procedures/04.transactions",{"title":2518,"path":2519,"stem":2520},"Зберігаємі процедури","/databases/triggers-stored-procedures/stored-procedures","06.databases/07.triggers-stored-procedures/05.stored-procedures",{"title":2522,"path":2523,"stem":2524},"Користувацькі функції","/databases/triggers-stored-procedures/user-defined-functions","06.databases/07.triggers-stored-procedures/06.user-defined-functions",{"title":2526,"path":2527,"stem":2528},"Безпека баз даних","/databases/triggers-stored-procedures/security","06.databases/07.triggers-stored-procedures/08.security",{"title":2526,"icon":793,"path":2530,"stem":2531,"children":2532,"page":59},"/databases/security","06.databases/08.security",[2533,2537],{"title":2534,"path":2535,"stem":2536},"Вступ до безпеки баз даних","/databases/security/introduction","06.databases/08.security/01.introduction",{"title":2538,"path":2539,"stem":2540},"Системні представлення та метадані","/databases/security/system-views","06.databases/08.security/02.system-views",{"title":2542,"icon":2543,"path":2544,"stem":2545,"children":2546,"page":59},"Резервне копіювання та відновлення","i-lucide-database-backup","/databases/backup-recovery","06.databases/09.backup-recovery",[2547],{"title":2542,"path":2548,"stem":2549},"/databases/backup-recovery/backup-restore","06.databases/09.backup-recovery/01.backup-restore",{"title":2551,"icon":2552,"path":2553,"stem":2554,"children":2555,"page":59},"Повнотекстовий пошук","i-lucide-search","/databases/full-text-search","06.databases/10.full-text-search",[2556],{"title":2551,"path":2557,"stem":2558},"/databases/full-text-search/full-text-search","06.databases/10.full-text-search/01.full-text-search",{"title":2560,"icon":2561,"path":2562,"stem":2563,"children":2564,"page":59},"Tools","i-lucide-wrench","/tools","07.tools",[2565],{"title":2566,"icon":2567,"path":2568,"stem":2569,"children":2570},"Docker","i-simple-icons-docker","/tools/docker","07.tools/01.docker/index",[2571,2573,2577,2581,2585,2589,2593,2597,2601,2605,2609,2613,2617,2621,2625,2629,2633,2637],{"title":2572,"path":2568,"stem":2569},"Docker: від нуля до production",{"title":2574,"path":2575,"stem":2576},"Контейнеризація — від проблеми до рішення","/tools/docker/containerization-concept","07.tools/01.docker/01.containerization-concept",{"title":2578,"path":2579,"stem":2580},"Docker — що це і навіщо?","/tools/docker/docker-what-and-why","07.tools/01.docker/02.docker-what-and-why",{"title":2582,"path":2583,"stem":2584},"Архітектура Docker Engine","/tools/docker/docker-architecture","07.tools/01.docker/03.docker-architecture",{"title":2586,"path":2587,"stem":2588},"Встановлення Docker","/tools/docker/installation","07.tools/01.docker/04.installation",{"title":2590,"path":2591,"stem":2592},"Перший контейнер — docker run","/tools/docker/first-container","07.tools/01.docker/05.first-container",{"title":2594,"path":2595,"stem":2596},"Життєвий цикл контейнера","/tools/docker/container-lifecycle","07.tools/01.docker/06.container-lifecycle",{"title":2598,"path":2599,"stem":2600},"Docker Images — фундаментальні концепції","/tools/docker/docker-images-fundamentals","07.tools/01.docker/07.docker-images-fundamentals",{"title":2602,"path":2603,"stem":2604},"Dockerfile — основи","/tools/docker/dockerfile-basics","07.tools/01.docker/08.dockerfile-basics",{"title":2606,"path":2607,"stem":2608},"Dockerfile — просунуті техніки","/tools/docker/dockerfile-advanced","07.tools/01.docker/09.dockerfile-advanced",{"title":2610,"path":2611,"stem":2612},"Build Context та кешування шарів","/tools/docker/build-context-and-cache","07.tools/01.docker/10.build-context-and-cache",{"title":2614,"path":2615,"stem":2616},"Реєстри Docker-образів","/tools/docker/image-registries","07.tools/01.docker/11.image-registries",{"title":2618,"path":2619,"stem":2620},"Контейнеризація .NET додатків","/tools/docker/dotnet-containerization","07.tools/01.docker/12.dotnet-containerization",{"title":2622,"path":2623,"stem":2624},"Томи та збереження даних","/tools/docker/volumes-and-data","07.tools/01.docker/13.volumes-and-data",{"title":2626,"path":2627,"stem":2628},"Основи мережі в Docker","/tools/docker/networking-basics","07.tools/01.docker/14.networking-basics",{"title":2630,"path":2631,"stem":2632},"Змінні оточення та конфігурація","/tools/docker/environment-and-configuration","07.tools/01.docker/15.environment-and-configuration",{"title":2634,"path":2635,"stem":2636},"Docker Compose — оркестрація контейнерів","/tools/docker/docker-compose-basics","07.tools/01.docker/16.docker-compose-basics",{"title":2638,"path":2639,"stem":2640},"Docker Compose — Multi-Service застосунки","/tools/docker/compose-multi-service","07.tools/01.docker/17.compose-multi-service",{"title":2642,"icon":2643,"path":2644,"stem":2645,"children":2646,"page":59},"Software Engineering","i-lucide-code-2","/software-engineering","09.software-engineering",[2647,2651,2655,2659,2663,2667,2671,2675,2679,2683,2687],{"title":2648,"path":2649,"stem":2650},"1. Аналіз предметної області. Експертні знання та складність","/software-engineering/intro.subdomains","09.software-engineering/01.intro.subdomains",{"title":2652,"path":2653,"stem":2654},"2. Обмежені контексти. Інтеграція обмежених контекстів","/software-engineering/integrating-limited-contexts","09.software-engineering/02.integrating-limited-contexts",{"title":2656,"path":2657,"stem":2658},"3. Реалізація простої бізнес-логіки","/software-engineering/simple","09.software-engineering/03.simple",{"title":2660,"path":2661,"stem":2662},"4. Опрацювання складної бізнес-логіки","/software-engineering/complex-business-logic","09.software-engineering/04.complex-business-logic",{"title":2664,"path":2665,"stem":2666},"5. Моделювання фактора часу. Подієво-орієнтована архітектура.","/software-engineering/modelling-the-time-factor","09.software-engineering/05.modelling-the-time-factor",{"title":2668,"path":2669,"stem":2670},"6. Архітектурні патерни","/software-engineering/architectural-patterns","09.software-engineering/06.architectural-patterns",{"title":2672,"path":2673,"stem":2674},"Паттерни взаємодії","/software-engineering/patterns-of-interaction","09.software-engineering/07.patterns-of-interaction",{"title":2676,"path":2677,"stem":2678},"Евристика проєктування","/software-engineering/design-heuristics","09.software-engineering/08.design-heuristics",{"title":2680,"path":2681,"stem":2682},"Еволюція проєктних рішень","/software-engineering/evolution-of-design-solutions","09.software-engineering/09.evolution-of-design-solutions",{"title":2684,"path":2685,"stem":2686},"EventStorming","/software-engineering/eventstorming","09.software-engineering/10.eventstorming",{"title":2688,"path":2689,"stem":2690},"DDD на практиці","/software-engineering/ddd-in-practice","09.software-engineering/11.ddd-in-practice",{"title":2692,"icon":943,"path":2693,"stem":2694,"children":2695,"page":59},"DDD","/ddd","10.ddd",[2696,2700,2704,2708,2712,2716,2720,2724,2728,2732,2736,2740,2744],{"title":2697,"path":2698,"stem":2699},"Аналіз предметної області","/ddd/domain-analysis","10.ddd/01.domain-analysis",{"title":2701,"path":2702,"stem":2703},"Експертні знання про предметну область","/ddd/domain-expert-knowledge","10.ddd/02.domain-expert-knowledge",{"title":2705,"path":2706,"stem":2707},"Як осмислити складність предметної області","/ddd/managing-domain-complexity","10.ddd/03.managing-domain-complexity",{"title":2709,"path":2710,"stem":2711},"Інтеграція обмежених контекстів","/ddd/bounded-context-integration","10.ddd/04.bounded-context-integration",{"title":2713,"path":2714,"stem":2715},"Реалізація простої бізнес-логіки","/ddd/simple-business-logic","10.ddd/05.simple-business-logic",{"title":2717,"path":2718,"stem":2719},"Обробка складної бізнес-логіки","/ddd/complex-business-logic","10.ddd/06.complex-business-logic",{"title":2721,"path":2722,"stem":2723},"Моделювання фактора часу","/ddd/time-modeling","10.ddd/07.time-modeling",{"title":2725,"path":2726,"stem":2727},"Глава 8. Архітектурні Патерни","/ddd/architectural-patterns","10.ddd/08.architectural-patterns",{"title":2729,"path":2730,"stem":2731},"Глава 9. Патерни Взаємодії","/ddd/interaction-patterns","10.ddd/09.interaction-patterns",{"title":2733,"path":2734,"stem":2735},"Глава 10. Проектні Евристики","/ddd/design-heuristics","10.ddd/10.design-heuristics",{"title":2737,"path":2738,"stem":2739},"Глава 11. Еволюція Проектних Рішень","/ddd/evolution-of-design-decisions","10.ddd/11.evolution-of-design-decisions",{"title":2741,"path":2742,"stem":2743},"Глава 12. EventStorming","/ddd/event-storming","10.ddd/12.event-storming",{"title":2745,"path":2746,"stem":2747},"Глава 13. DDD на Практиці","/ddd/ddd-in-practice","10.ddd/13.ddd-in-practice",{"title":2749,"icon":2750,"path":2751,"stem":2752,"children":2753,"page":59},"Media Streaming","i-lucide-video","/media-streaming","11.media-streaming",[2754,2758,2762,2766,2770,2774,2778],{"title":2755,"path":2756,"stem":2757},"01. Магія Стрімінгу: Що відбувається, коли ви натискаєте \"Play\"","/media-streaming/introduction","11.media-streaming/01.introduction",{"title":2759,"path":2760,"stem":2761},"02. Анатомія Медіа: Кодеки, Контейнери та Стиснення","/media-streaming/audio-video-anatomy","11.media-streaming/02.audio-video-anatomy",{"title":2763,"path":2764,"stem":2765},"03. The Gym: FFmpeg Deep Dive","/media-streaming/ffmpeg-gym","11.media-streaming/03.ffmpeg-gym",{"title":2767,"path":2768,"stem":2769},"04. HLS Protocol: HTTP Live Streaming у Деталях","/media-streaming/hls-protocol","11.media-streaming/04.hls-protocol",{"title":2771,"path":2772,"stem":2773},"05. DASH Protocol: Відкритий Стандарт","/media-streaming/dash-protocol","11.media-streaming/05.dash-protocol",{"title":2775,"path":2776,"stem":2777},"06. Масштабування: CDN та Adaptive Bitrate","/media-streaming/cdn-and-adaptive-bitrate","11.media-streaming/06.cdn-and-adaptive-bitrate",{"title":2779,"path":2780,"stem":2781},"07. Війна із Затримкою (Latency)","/media-streaming/realtime-latency","11.media-streaming/07.realtime-latency",{"title":2783,"icon":2784,"path":2785,"stem":2786,"children":2787,"page":59},"HTML & CSS","i-devicon-html5","/html-css","12.html-css",[2788,2792,2796,2800,2804,2808,2812,2816,2820,2824,2828,2832,2836,2840,2844,2848,2852,2856,2860,2864,2868,2872,2876,2880,2884,2888,2892,2896,2900,2904],{"title":2789,"path":2790,"stem":2791},"Вступ до HTML. Структура документа","/html-css/intro-html-structure","12.html-css/01.intro-html-structure",{"title":2793,"path":2794,"stem":2795},"Форматування тексту в HTML","/html-css/html-text-formatting","12.html-css/02.html-text-formatting",{"title":2797,"path":2798,"stem":2799},"Посилання та зображення в HTML","/html-css/html-links-images","12.html-css/03.html-links-images",{"title":2801,"path":2802,"stem":2803},"Списки та таблиці в HTML","/html-css/html-lists-tables","12.html-css/04.html-lists-tables",{"title":2805,"path":2806,"stem":2807},"Форми в HTML","/html-css/html-forms","12.html-css/05.html-forms",{"title":2809,"path":2810,"stem":2811},"Семантичні елементи HTML5","/html-css/html-semantic-elements","12.html-css/06.html-semantic-elements",{"title":2813,"path":2814,"stem":2815},"Мультимедіа та розширені елементи HTML","/html-css/html-multimedia-advanced","12.html-css/07.html-multimedia-advanced",{"title":2817,"path":2818,"stem":2819},"Мікророзмітка та SEO в HTML","/html-css/html-microdata-seo","12.html-css/08.html-microdata-seo",{"title":2821,"path":2822,"stem":2823},"Вступ до CSS. Селектори та специфічність","/html-css/css-intro-selectors","12.html-css/09.css-intro-selectors",{"title":2825,"path":2826,"stem":2827},"Блокова модель CSS. Відступи. Box Sizing","/html-css/css-box-model","12.html-css/10.css-box-model",{"title":2829,"path":2830,"stem":2831},"Розміри у CSS: повний довідник одиниць і ключових слів","/html-css/10a.css-sizing","12.html-css/10a.css-sizing",{"title":2833,"path":2834,"stem":2835},"Типографіка в CSS. Шрифти та текст","/html-css/css-typography","12.html-css/11.css-typography",{"title":2837,"path":2838,"stem":2839},"Кольори та фони в CSS","/html-css/css-colors-backgrounds","12.html-css/12.css-colors-backgrounds",{"title":2841,"path":2842,"stem":2843},"Тіні та фільтри в CSS","/html-css/12b.css-shadows-filters","12.html-css/12b.css-shadows-filters",{"title":2845,"path":2846,"stem":2847},"CSS Flexbox: Фундамент гнучких макетів","/html-css/css-flexbox-fundamentals","12.html-css/13.css-flexbox-fundamentals",{"title":2849,"path":2850,"stem":2851},"CSS Flexbox: Вирівнювання та Позиціонування","/html-css/css-flexbox-alignment-sizing-and-patterns","12.html-css/14.css-flexbox-alignment-sizing-and-patterns",{"title":2853,"path":2854,"stem":2855},"CSS Grid. Двовимірний макет. Частина 1","/html-css/css-layout-grid","12.html-css/15.css-layout-grid",{"title":2857,"path":2858,"stem":2859},"CSS Grid. Двовимірний макет. Частина 2","/html-css/css-layout-grid-advanced","12.html-css/16.css-layout-grid-advanced",{"title":2861,"path":2862,"stem":2863},"Позиціонування в CSS. Z-index. Stacking Context","/html-css/css-positioning","12.html-css/17.css-positioning",{"title":2865,"path":2866,"stem":2867},"CSS Анімації та Переходи","/html-css/css-animations-transitions","12.html-css/18.css-animations-transitions",{"title":2869,"path":2870,"stem":2871},"Адаптивний дизайн. Media Queries. Частина 1","/html-css/css-responsive-media-queries","12.html-css/19.css-responsive-media-queries",{"title":2873,"path":2874,"stem":2875},"Адаптивний дизайн. Частина 2: clamp(), Container Queries, @layer","/html-css/css-responsive-advanced","12.html-css/20.css-responsive-advanced",{"title":2877,"path":2878,"stem":2879},"CSS Custom Properties. Методології. Сучасний CSS","/html-css/css-variables-methodologies","12.html-css/21.css-variables-methodologies",{"title":2881,"path":2882,"stem":2883},"Сучасний CSS 2023–2025: Нові можливості","/html-css/css-modern-features","12.html-css/22.css-modern-features",{"title":2885,"path":2886,"stem":2887},"CSS Nesting, @layer, @scope та @property: нативний препроцесор","/html-css/22a.css-nesting-modern-syntax","12.html-css/22a.css-nesting-modern-syntax",{"title":2889,"path":2890,"stem":2891},"CSS для форм та інтерактивних станів","/html-css/css-forms-interactive-states","12.html-css/23.css-forms-interactive-states",{"title":2893,"path":2894,"stem":2895},"Доступність у CSS (CSS Accessibility)","/html-css/css-accessibility","12.html-css/24.css-accessibility",{"title":2897,"path":2898,"stem":2899},"CSS-функції та сучасні sizing primitives","/html-css/css-functions-sizing","12.html-css/25.css-functions-sizing",{"title":2901,"path":2902,"stem":2903},"Rendering Pipeline і CSS Performance","/html-css/css-rendering-performance","12.html-css/26.css-rendering-performance",{"title":2905,"path":2906,"stem":2907},"CSS Best Practices: типові ситуації та правильні рішення","/html-css/css-best-practices","12.html-css/27.css-best-practices",{"title":2909,"path":2910,"stem":2911,"children":2912,"page":59},"Tailwind","/tailwind","21.tailwind",[2913,2917,2921,2925,2929,2933,2937,2941],{"title":2914,"path":2915,"stem":2916},"Що таке Tailwind CSS і навіщо він потрібен","/tailwind/tailwind-intro-philosophy","21.tailwind/01.tailwind-intro-philosophy",{"title":2918,"path":2919,"stem":2920},"Встановлення та налаштування Tailwind CSS v4","/tailwind/tailwind-installation-setup","21.tailwind/02.tailwind-installation-setup",{"title":2922,"path":2923,"stem":2924},"Utility-класи: основи та система Tailwind","/tailwind/tailwind-utility-classes-core","21.tailwind/03.tailwind-utility-classes-core",{"title":2926,"path":2927,"stem":2928},"Layout: Flexbox та Grid через Tailwind","/tailwind/tailwind-flexbox-grid","21.tailwind/04.tailwind-flexbox-grid",{"title":2930,"path":2931,"stem":2932},"Кастомізація теми через @theme у Tailwind v4","/tailwind/tailwind-theme-customization","21.tailwind/05.tailwind-theme-customization",{"title":2934,"path":2935,"stem":2936},"Варіанти: hover, focus, responsive, dark mode та нові v4","/tailwind/tailwind-variants-states","21.tailwind/06.tailwind-variants-states",{"title":2938,"path":2939,"stem":2940},"Типографіка та система кольорів у Tailwind v4","/tailwind/tailwind-typography-colors","21.tailwind/07.tailwind-typography-colors",{"title":2942,"path":2943,"stem":2944},"Компоненти та повторюваність: @apply, @utility та патерни","/tailwind/tailwind-components-patterns","21.tailwind/08.tailwind-components-patterns",{"title":2946,"path":2947,"stem":2948},"Showcase Компонентів kostyl.dev","/test-new-components","98.test-new-components",{"id":2950,"title":1597,"body":2951,"description":9768,"extension":9769,"links":9770,"meta":9771,"navigation":5928,"path":1598,"seo":9773,"stem":1599,"__hash__":9774},"docs/01.csharp/12.desktop-ui/39a.avalonia-animations.md",{"type":2952,"value":2953,"toc":9717},"minimark",[2954,2958,2963,2989,3008,3011,3033,3036,3040,3045,3051,3077,3081,3095,3098,3213,3219,3223,3237,3403,3409,3457,3466,3474,3476,3480,3483,3486,3505,3538,3542,3556,3583,3586,3763,3772,3776,3790,3816,3819,3823,3830,3863,3866,4013,4035,4072,4074,4078,4081,4210,4212,4243,4249,4251,4255,4262,4266,4315,4319,4582,4587,4630,4645,4658,4660,4664,4670,4680,4684,4687,4707,4709,4876,4880,4920,4937,4941,4944,5217,5222,5249,5253,5256,5692,5695,5714,5718,5724,5950,5961,5963,5967,5970,5974,6329,6335,6339,6487,6492,6496,6600,6683,6685,6689,6693,6699,6761,6765,6770,6946,6950,6966,7189,7201,7205,7211,7257,7261,7270,7361,7367,7388,7390,7394,7397,7401,7411,7415,7904,8058,8064,8068,8354,8448,8453,8457,8558,8574,8585,8587,8591,8595,8601,8606,8630,8635,8754,8760,8762,8766,8771,8775,8802,8806,9037,9042,9044,9048,9055,9059,9107,9111,9418,9481,9486,9500,9502,9506,9520,9554,9559,9585,9593,9595,9599,9667,9669,9673,9700,9702,9713],[2955,2956,1597],"h1",{"id":2957},"анімації-в-avalonia",[2959,2960,2962],"h2",{"id":2961},"вступ","Вступ",[2964,2965,2966,2967,2971,2972,2975,2976,2979,2980,2983,2984,2988],"p",{},"Якщо ви вже знайомі з анімаціями у WPF, то підхід Avalonia може здатися вам революційним. Там, де WPF вимагає створення ",[2968,2969,2970],"code",{},"Storyboard",", визначення ",[2968,2973,2974],{},"DoubleAnimation",", налаштування ",[2968,2977,2978],{},"TargetProperty"," та ",[2968,2981,2982],{},"TargetName",", Avalonia пропонує набагато простіший механізм — ",[2985,2986,2987],"strong",{},"Transitions"," (переходи).",[2964,2990,2991,2992,2995,2996,2999,3000,3003,3004,3007],{},"Філософія Avalonia полягає в тому, що анімації мають бути ",[2985,2993,2994],{},"неявними"," (implicit) та ",[2985,2997,2998],{},"декларативними",". Замість того, щоб явно описувати, як саме змінюється властивість від значення A до значення B, ви просто вказуєте: \"коли ця властивість зміниться, анімуй її протягом 300 мілісекунд\". Це нагадує підхід CSS-transitions у веб-розробці, де зміна ",[2968,3001,3002],{},"opacity"," автоматично анімується, якщо визначено ",[2968,3005,3006],{},"transition: opacity 0.3s",".",[2964,3009,3010],{},"У цій статті ми розглянемо, як працюють Transitions в Avalonia, які типи переходів доступні, як використовувати KeyFrame анімації для складніших сценаріїв, і порівняємо обсяг коду з WPF. Ви побачите, що той самий ефект, який у WPF займає 15-20 рядків XAML, в Avalonia можна реалізувати в 3-5 рядків.",[3012,3013,3015,3018,3019,3021,3022,3024,3025,3028,3029,3032],"note",{"icon":3014},"lucide:info",[2985,3016,3017],{},"Важливо",": Avalonia не має класу ",[2968,3020,2970],{}," у тому вигляді, як у WPF. Замість цього використовуються ",[2968,3023,2987],{}," для простих анімацій та ",[2968,3026,3027],{},"Animation"," з ",[2968,3030,3031],{},"KeyFrame"," для складних сценаріїв.",[3034,3035],"hr",{},[2959,3037,3039],{"id":3038},"transitions-неявні-анімації-властивостей","Transitions — неявні анімації властивостей",[3041,3042,3044],"h3",{"id":3043},"концепція-transitions","Концепція Transitions",[2964,3046,3047,3050],{},[2985,3048,3049],{},"Transition"," (перехід) — це механізм, який автоматично анімує зміну властивості елемента. Ви визначаєте, яку властивість потрібно анімувати, тривалість анімації, функцію пом'якшення (easing), і Avalonia автоматично застосовує плавний перехід щоразу, коли ця властивість змінюється.",[2964,3052,3053,3054,3057,3058,3061,3062,3065,3066,3069,3070,3072,3073,3076],{},"Наприклад, якщо ви встановите ",[2968,3055,3056],{},"Opacity"," кнопки з ",[2968,3059,3060],{},"1.0"," на ",[2968,3063,3064],{},"0.5",", і визначите ",[2968,3067,3068],{},"DoubleTransition"," для властивості ",[2968,3071,3056],{},", Avalonia автоматично створить плавну анімацію зміни прозорості. Вам не потрібно викликати ",[2968,3074,3075],{},"Storyboard.Begin()"," чи писати код-behind — все відбувається декларативно.",[3041,3078,3080],{"id":3079},"синтаксис-transitions","Синтаксис Transitions",[2964,3082,3083,3084,3086,3087,3090,3091,3094],{},"Transitions визначаються через властивість ",[2968,3085,2987],{}," будь-якого ",[2968,3088,3089],{},"Control",". Це колекція об'єктів типу ",[2968,3092,3093],{},"ITransition",", кожен з яких відповідає за анімацію однієї властивості.",[2964,3096,3097],{},"Базовий синтаксис:",[3099,3100,3105],"pre",{"className":3101,"code":3102,"language":3103,"meta":3104,"style":3104},"language-xml shiki shiki-themes light-plus dark-plus dark-plus","\u003CButton Content=\"Наведи на мене\">\n    \u003CButton.Transitions>\n        \u003CTransitions>\n            \u003CDoubleTransition Property=\"Opacity\" Duration=\"0:0:0.3\"/>\n        \u003C/Transitions>\n    \u003C/Button.Transitions>\n\u003C/Button>\n","xml","",[2968,3106,3107,3135,3146,3156,3183,3193,3203],{"__ignoreMap":3104},[3108,3109,3112,3116,3120,3124,3128,3132],"span",{"class":3110,"line":3111},"line",1,[3108,3113,3115],{"class":3114},"s0P7L","\u003C",[3108,3117,3119],{"class":3118},"sKtos","Button",[3108,3121,3123],{"class":3122},"sa4r_"," Content",[3108,3125,3127],{"class":3126},"sHH4Y","=",[3108,3129,3131],{"class":3130},"su9tN","\"Наведи на мене\"",[3108,3133,3134],{"class":3114},">\n",[3108,3136,3138,3141,3144],{"class":3110,"line":3137},2,[3108,3139,3140],{"class":3114},"    \u003C",[3108,3142,3143],{"class":3118},"Button.Transitions",[3108,3145,3134],{"class":3114},[3108,3147,3149,3152,3154],{"class":3110,"line":3148},3,[3108,3150,3151],{"class":3114},"        \u003C",[3108,3153,2987],{"class":3118},[3108,3155,3134],{"class":3114},[3108,3157,3159,3162,3164,3167,3169,3172,3175,3177,3180],{"class":3110,"line":3158},4,[3108,3160,3161],{"class":3114},"            \u003C",[3108,3163,3068],{"class":3118},[3108,3165,3166],{"class":3122}," Property",[3108,3168,3127],{"class":3126},[3108,3170,3171],{"class":3130},"\"Opacity\"",[3108,3173,3174],{"class":3122}," Duration",[3108,3176,3127],{"class":3126},[3108,3178,3179],{"class":3130},"\"0:0:0.3\"",[3108,3181,3182],{"class":3114},"/>\n",[3108,3184,3186,3189,3191],{"class":3110,"line":3185},5,[3108,3187,3188],{"class":3114},"        \u003C/",[3108,3190,2987],{"class":3118},[3108,3192,3134],{"class":3114},[3108,3194,3196,3199,3201],{"class":3110,"line":3195},6,[3108,3197,3198],{"class":3114},"    \u003C/",[3108,3200,3143],{"class":3118},[3108,3202,3134],{"class":3114},[3108,3204,3206,3209,3211],{"class":3110,"line":3205},7,[3108,3207,3208],{"class":3114},"\u003C/",[3108,3210,3119],{"class":3118},[3108,3212,3134],{"class":3114},[2964,3214,3215,3216,3218],{},"Тепер, коли ",[2968,3217,3056],{}," кнопки зміниться (наприклад, через стиль або код), зміна буде анімована протягом 300 мілісекунд.",[3041,3220,3222],{"id":3221},"приклад-hover-ефект-з-transition","Приклад: Hover-ефект з Transition",[2964,3224,3225,3226,3229,3230,3229,3232,3028,3234,3236],{},"Розглянемо класичний сценарій — зміна прозорості кнопки при наведенні миші. У WPF це вимагало б ",[2968,3227,3228],{},"EventTrigger",", ",[2968,3231,2970],{},[2968,3233,2974],{},[2968,3235,2978],{},". В Avalonia це виглядає так:",[3099,3238,3240],{"className":3101,"code":3239,"language":3103,"meta":3104,"style":3104},"\u003CButton Content=\"Hover Me\" Opacity=\"1.0\">\n    \u003CButton.Transitions>\n        \u003CTransitions>\n            \u003CDoubleTransition Property=\"Opacity\" Duration=\"0:0:0.3\" Easing=\"CubicEaseInOut\"/>\n        \u003C/Transitions>\n    \u003C/Button.Transitions>\n    \u003CButton.Styles>\n        \u003CStyle Selector=\"Button:pointerover\">\n            \u003CSetter Property=\"Opacity\" Value=\"0.7\"/>\n        \u003C/Style>\n    \u003C/Button.Styles>\n\u003C/Button>\n",[2968,3241,3242,3265,3273,3281,3309,3317,3325,3334,3352,3376,3385,3394],{"__ignoreMap":3104},[3108,3243,3244,3246,3248,3250,3252,3255,3258,3260,3263],{"class":3110,"line":3111},[3108,3245,3115],{"class":3114},[3108,3247,3119],{"class":3118},[3108,3249,3123],{"class":3122},[3108,3251,3127],{"class":3126},[3108,3253,3254],{"class":3130},"\"Hover Me\"",[3108,3256,3257],{"class":3122}," Opacity",[3108,3259,3127],{"class":3126},[3108,3261,3262],{"class":3130},"\"1.0\"",[3108,3264,3134],{"class":3114},[3108,3266,3267,3269,3271],{"class":3110,"line":3137},[3108,3268,3140],{"class":3114},[3108,3270,3143],{"class":3118},[3108,3272,3134],{"class":3114},[3108,3274,3275,3277,3279],{"class":3110,"line":3148},[3108,3276,3151],{"class":3114},[3108,3278,2987],{"class":3118},[3108,3280,3134],{"class":3114},[3108,3282,3283,3285,3287,3289,3291,3293,3295,3297,3299,3302,3304,3307],{"class":3110,"line":3158},[3108,3284,3161],{"class":3114},[3108,3286,3068],{"class":3118},[3108,3288,3166],{"class":3122},[3108,3290,3127],{"class":3126},[3108,3292,3171],{"class":3130},[3108,3294,3174],{"class":3122},[3108,3296,3127],{"class":3126},[3108,3298,3179],{"class":3130},[3108,3300,3301],{"class":3122}," Easing",[3108,3303,3127],{"class":3126},[3108,3305,3306],{"class":3130},"\"CubicEaseInOut\"",[3108,3308,3182],{"class":3114},[3108,3310,3311,3313,3315],{"class":3110,"line":3185},[3108,3312,3188],{"class":3114},[3108,3314,2987],{"class":3118},[3108,3316,3134],{"class":3114},[3108,3318,3319,3321,3323],{"class":3110,"line":3195},[3108,3320,3198],{"class":3114},[3108,3322,3143],{"class":3118},[3108,3324,3134],{"class":3114},[3108,3326,3327,3329,3332],{"class":3110,"line":3205},[3108,3328,3140],{"class":3114},[3108,3330,3331],{"class":3118},"Button.Styles",[3108,3333,3134],{"class":3114},[3108,3335,3337,3339,3342,3345,3347,3350],{"class":3110,"line":3336},8,[3108,3338,3151],{"class":3114},[3108,3340,3341],{"class":3118},"Style",[3108,3343,3344],{"class":3122}," Selector",[3108,3346,3127],{"class":3126},[3108,3348,3349],{"class":3130},"\"Button:pointerover\"",[3108,3351,3134],{"class":3114},[3108,3353,3355,3357,3360,3362,3364,3366,3369,3371,3374],{"class":3110,"line":3354},9,[3108,3356,3161],{"class":3114},[3108,3358,3359],{"class":3118},"Setter",[3108,3361,3166],{"class":3122},[3108,3363,3127],{"class":3126},[3108,3365,3171],{"class":3130},[3108,3367,3368],{"class":3122}," Value",[3108,3370,3127],{"class":3126},[3108,3372,3373],{"class":3130},"\"0.7\"",[3108,3375,3182],{"class":3114},[3108,3377,3379,3381,3383],{"class":3110,"line":3378},10,[3108,3380,3188],{"class":3114},[3108,3382,3341],{"class":3118},[3108,3384,3134],{"class":3114},[3108,3386,3388,3390,3392],{"class":3110,"line":3387},11,[3108,3389,3198],{"class":3114},[3108,3391,3331],{"class":3118},[3108,3393,3134],{"class":3114},[3108,3395,3397,3399,3401],{"class":3110,"line":3396},12,[3108,3398,3208],{"class":3114},[3108,3400,3119],{"class":3118},[3108,3402,3134],{"class":3114},[2964,3404,3405,3408],{},[2985,3406,3407],{},"Що тут відбувається",":",[3410,3411,3412,3424,3440],"ol",{},[3413,3414,3415,3417,3418,3420,3421,3007],"li",{},[2985,3416,2987],{},": Визначаємо, що властивість ",[2968,3419,3056],{}," має анімуватися протягом 0.3 секунди з функцією ",[2968,3422,3423],{},"CubicEaseInOut",[3413,3425,3426,3429,3430,3433,3434,3436,3437,3007],{},[2985,3427,3428],{},"Styles",": Коли користувач наводить мишу (",[2968,3431,3432],{},":pointerover","), ",[2968,3435,3056],{}," змінюється на ",[2968,3438,3439],{},"0.7",[3413,3441,3442,3445,3446,3448,3449,3451,3452,3454,3455,3007],{},[2985,3443,3444],{},"Автоматична анімація",": Avalonia бачить, що ",[2968,3447,3056],{}," змінилася, і застосовує визначений ",[2968,3450,3068],{}," — плавний перехід від ",[2968,3453,3060],{}," до ",[2968,3456,3439],{},[2964,3458,3459,3460,3462,3463,3465],{},"Коли користувач прибирає мишу, ",[2968,3461,3056],{}," повертається до ",[2968,3464,3060],{},", і анімація відбувається у зворотному напрямку.",[3467,3468,3470,3473],"tip",{"icon":3469},"lucide:lightbulb",[2985,3471,3472],{},"Порада",": Transitions працюють у обидва боки. Якщо властивість змінюється з A на B, анімація відбувається. Якщо потім змінюється з B на A — анімація також відбувається у зворотному напрямку.",[3034,3475],{},[2959,3477,3479],{"id":3478},"типи-transitions","Типи Transitions",[2964,3481,3482],{},"Avalonia надає кілька вбудованих типів переходів для різних типів властивостей:",[3041,3484,3068],{"id":3485},"doubletransition",[2964,3487,3488,3489,3492,3493,3229,3495,3229,3498,3229,3501,3504],{},"Анімує властивості типу ",[2968,3490,3491],{},"double"," — ",[2968,3494,3056],{},[2968,3496,3497],{},"Width",[2968,3499,3500],{},"Height",[2968,3502,3503],{},"FontSize",", кути обертання тощо.",[3099,3506,3508],{"className":3101,"code":3507,"language":3103,"meta":3104,"style":3104},"\u003CDoubleTransition Property=\"Opacity\" Duration=\"0:0:0.5\" Easing=\"QuadraticEaseOut\"/>\n",[2968,3509,3510],{"__ignoreMap":3104},[3108,3511,3512,3514,3516,3518,3520,3522,3524,3526,3529,3531,3533,3536],{"class":3110,"line":3111},[3108,3513,3115],{"class":3114},[3108,3515,3068],{"class":3118},[3108,3517,3166],{"class":3122},[3108,3519,3127],{"class":3126},[3108,3521,3171],{"class":3130},[3108,3523,3174],{"class":3122},[3108,3525,3127],{"class":3126},[3108,3527,3528],{"class":3130},"\"0:0:0.5\"",[3108,3530,3301],{"class":3122},[3108,3532,3127],{"class":3126},[3108,3534,3535],{"class":3130},"\"QuadraticEaseOut\"",[3108,3537,3182],{"class":3114},[3041,3539,3541],{"id":3540},"brushtransition","BrushTransition",[2964,3543,3544,3545,3548,3549,3229,3552,3555],{},"Анімує зміну кольорів у ",[2968,3546,3547],{},"Brush"," (наприклад, ",[2968,3550,3551],{},"Background",[2968,3553,3554],{},"Foreground","). Avalonia інтерполює кольори, створюючи плавний перехід між відтінками.",[3099,3557,3559],{"className":3101,"code":3558,"language":3103,"meta":3104,"style":3104},"\u003CBrushTransition Property=\"Background\" Duration=\"0:0:0.4\"/>\n",[2968,3560,3561],{"__ignoreMap":3104},[3108,3562,3563,3565,3567,3569,3571,3574,3576,3578,3581],{"class":3110,"line":3111},[3108,3564,3115],{"class":3114},[3108,3566,3541],{"class":3118},[3108,3568,3166],{"class":3122},[3108,3570,3127],{"class":3126},[3108,3572,3573],{"class":3130},"\"Background\"",[3108,3575,3174],{"class":3122},[3108,3577,3127],{"class":3126},[3108,3579,3580],{"class":3130},"\"0:0:0.4\"",[3108,3582,3182],{"class":3114},[2964,3584,3585],{},"Приклад використання:",[3099,3587,3589],{"className":3101,"code":3588,"language":3103,"meta":3104,"style":3104},"\u003CBorder Background=\"LightBlue\" CornerRadius=\"8\" Padding=\"20\">\n    \u003CBorder.Transitions>\n        \u003CTransitions>\n            \u003CBrushTransition Property=\"Background\" Duration=\"0:0:0.4\"/>\n        \u003C/Transitions>\n    \u003C/Border.Transitions>\n    \u003CBorder.Styles>\n        \u003CStyle Selector=\"Border:pointerover\">\n            \u003CSetter Property=\"Background\" Value=\"LightCoral\"/>\n        \u003C/Style>\n    \u003C/Border.Styles>\n    \u003CTextBlock Text=\"Наведи на мене\"/>\n\u003C/Border>\n",[2968,3590,3591,3624,3633,3641,3661,3669,3677,3686,3701,3722,3730,3738,3754],{"__ignoreMap":3104},[3108,3592,3593,3595,3598,3601,3603,3606,3609,3611,3614,3617,3619,3622],{"class":3110,"line":3111},[3108,3594,3115],{"class":3114},[3108,3596,3597],{"class":3118},"Border",[3108,3599,3600],{"class":3122}," Background",[3108,3602,3127],{"class":3126},[3108,3604,3605],{"class":3130},"\"LightBlue\"",[3108,3607,3608],{"class":3122}," CornerRadius",[3108,3610,3127],{"class":3126},[3108,3612,3613],{"class":3130},"\"8\"",[3108,3615,3616],{"class":3122}," Padding",[3108,3618,3127],{"class":3126},[3108,3620,3621],{"class":3130},"\"20\"",[3108,3623,3134],{"class":3114},[3108,3625,3626,3628,3631],{"class":3110,"line":3137},[3108,3627,3140],{"class":3114},[3108,3629,3630],{"class":3118},"Border.Transitions",[3108,3632,3134],{"class":3114},[3108,3634,3635,3637,3639],{"class":3110,"line":3148},[3108,3636,3151],{"class":3114},[3108,3638,2987],{"class":3118},[3108,3640,3134],{"class":3114},[3108,3642,3643,3645,3647,3649,3651,3653,3655,3657,3659],{"class":3110,"line":3158},[3108,3644,3161],{"class":3114},[3108,3646,3541],{"class":3118},[3108,3648,3166],{"class":3122},[3108,3650,3127],{"class":3126},[3108,3652,3573],{"class":3130},[3108,3654,3174],{"class":3122},[3108,3656,3127],{"class":3126},[3108,3658,3580],{"class":3130},[3108,3660,3182],{"class":3114},[3108,3662,3663,3665,3667],{"class":3110,"line":3185},[3108,3664,3188],{"class":3114},[3108,3666,2987],{"class":3118},[3108,3668,3134],{"class":3114},[3108,3670,3671,3673,3675],{"class":3110,"line":3195},[3108,3672,3198],{"class":3114},[3108,3674,3630],{"class":3118},[3108,3676,3134],{"class":3114},[3108,3678,3679,3681,3684],{"class":3110,"line":3205},[3108,3680,3140],{"class":3114},[3108,3682,3683],{"class":3118},"Border.Styles",[3108,3685,3134],{"class":3114},[3108,3687,3688,3690,3692,3694,3696,3699],{"class":3110,"line":3336},[3108,3689,3151],{"class":3114},[3108,3691,3341],{"class":3118},[3108,3693,3344],{"class":3122},[3108,3695,3127],{"class":3126},[3108,3697,3698],{"class":3130},"\"Border:pointerover\"",[3108,3700,3134],{"class":3114},[3108,3702,3703,3705,3707,3709,3711,3713,3715,3717,3720],{"class":3110,"line":3354},[3108,3704,3161],{"class":3114},[3108,3706,3359],{"class":3118},[3108,3708,3166],{"class":3122},[3108,3710,3127],{"class":3126},[3108,3712,3573],{"class":3130},[3108,3714,3368],{"class":3122},[3108,3716,3127],{"class":3126},[3108,3718,3719],{"class":3130},"\"LightCoral\"",[3108,3721,3182],{"class":3114},[3108,3723,3724,3726,3728],{"class":3110,"line":3378},[3108,3725,3188],{"class":3114},[3108,3727,3341],{"class":3118},[3108,3729,3134],{"class":3114},[3108,3731,3732,3734,3736],{"class":3110,"line":3387},[3108,3733,3198],{"class":3114},[3108,3735,3683],{"class":3118},[3108,3737,3134],{"class":3114},[3108,3739,3740,3742,3745,3748,3750,3752],{"class":3110,"line":3396},[3108,3741,3140],{"class":3114},[3108,3743,3744],{"class":3118},"TextBlock",[3108,3746,3747],{"class":3122}," Text",[3108,3749,3127],{"class":3126},[3108,3751,3131],{"class":3130},[3108,3753,3182],{"class":3114},[3108,3755,3757,3759,3761],{"class":3110,"line":3756},13,[3108,3758,3208],{"class":3114},[3108,3760,3597],{"class":3118},[3108,3762,3134],{"class":3114},[2964,3764,3765,3766,3061,3769,3007],{},"При наведенні фон плавно змінюється з ",[2968,3767,3768],{},"LightBlue",[2968,3770,3771],{},"LightCoral",[3041,3773,3775],{"id":3774},"thicknesstransition","ThicknessTransition",[2964,3777,3488,3778,3492,3781,3229,3784,3229,3787,3007],{},[2968,3779,3780],{},"Thickness",[2968,3782,3783],{},"Margin",[2968,3785,3786],{},"Padding",[2968,3788,3789],{},"BorderThickness",[3099,3791,3793],{"className":3101,"code":3792,"language":3103,"meta":3104,"style":3104},"\u003CThicknessTransition Property=\"Margin\" Duration=\"0:0:0.3\"/>\n",[2968,3794,3795],{"__ignoreMap":3104},[3108,3796,3797,3799,3801,3803,3805,3808,3810,3812,3814],{"class":3110,"line":3111},[3108,3798,3115],{"class":3114},[3108,3800,3775],{"class":3118},[3108,3802,3166],{"class":3122},[3108,3804,3127],{"class":3126},[3108,3806,3807],{"class":3130},"\"Margin\"",[3108,3809,3174],{"class":3122},[3108,3811,3127],{"class":3126},[3108,3813,3179],{"class":3130},[3108,3815,3182],{"class":3114},[2964,3817,3818],{},"Це корисно для створення ефектів \"розсування\" елементів або зміни відступів.",[3041,3820,3822],{"id":3821},"transformoperationstransition","TransformOperationsTransition",[2964,3824,3825,3826,3829],{},"Анімує трансформації — ",[2968,3827,3828],{},"RenderTransform",". Це найпотужніший тип переходу, оскільки дозволяє анімувати обертання, масштабування, зсув одночасно.",[3099,3831,3833],{"className":3101,"code":3832,"language":3103,"meta":3104,"style":3104},"\u003CTransformOperationsTransition Property=\"RenderTransform\" Duration=\"0:0:0.5\" Easing=\"BackEaseOut\"/>\n",[2968,3834,3835],{"__ignoreMap":3104},[3108,3836,3837,3839,3841,3843,3845,3848,3850,3852,3854,3856,3858,3861],{"class":3110,"line":3111},[3108,3838,3115],{"class":3114},[3108,3840,3822],{"class":3118},[3108,3842,3166],{"class":3122},[3108,3844,3127],{"class":3126},[3108,3846,3847],{"class":3130},"\"RenderTransform\"",[3108,3849,3174],{"class":3122},[3108,3851,3127],{"class":3126},[3108,3853,3528],{"class":3130},[3108,3855,3301],{"class":3122},[3108,3857,3127],{"class":3126},[3108,3859,3860],{"class":3130},"\"BackEaseOut\"",[3108,3862,3182],{"class":3114},[2964,3864,3865],{},"Приклад — масштабування кнопки при наведенні:",[3099,3867,3869],{"className":3101,"code":3868,"language":3103,"meta":3104,"style":3104},"\u003CButton Content=\"Збільш мене\" RenderTransformOrigin=\"0.5, 0.5\">\n    \u003CButton.Transitions>\n        \u003CTransitions>\n            \u003CTransformOperationsTransition Property=\"RenderTransform\" Duration=\"0:0:0.3\"/>\n        \u003C/Transitions>\n    \u003C/Button.Transitions>\n    \u003CButton.Styles>\n        \u003CStyle Selector=\"Button:pointerover\">\n            \u003CSetter Property=\"RenderTransform\" Value=\"scale(1.1)\"/>\n        \u003C/Style>\n    \u003C/Button.Styles>\n\u003C/Button>\n",[2968,3870,3871,3894,3902,3910,3930,3938,3946,3954,3968,3989,3997,4005],{"__ignoreMap":3104},[3108,3872,3873,3875,3877,3879,3881,3884,3887,3889,3892],{"class":3110,"line":3111},[3108,3874,3115],{"class":3114},[3108,3876,3119],{"class":3118},[3108,3878,3123],{"class":3122},[3108,3880,3127],{"class":3126},[3108,3882,3883],{"class":3130},"\"Збільш мене\"",[3108,3885,3886],{"class":3122}," RenderTransformOrigin",[3108,3888,3127],{"class":3126},[3108,3890,3891],{"class":3130},"\"0.5, 0.5\"",[3108,3893,3134],{"class":3114},[3108,3895,3896,3898,3900],{"class":3110,"line":3137},[3108,3897,3140],{"class":3114},[3108,3899,3143],{"class":3118},[3108,3901,3134],{"class":3114},[3108,3903,3904,3906,3908],{"class":3110,"line":3148},[3108,3905,3151],{"class":3114},[3108,3907,2987],{"class":3118},[3108,3909,3134],{"class":3114},[3108,3911,3912,3914,3916,3918,3920,3922,3924,3926,3928],{"class":3110,"line":3158},[3108,3913,3161],{"class":3114},[3108,3915,3822],{"class":3118},[3108,3917,3166],{"class":3122},[3108,3919,3127],{"class":3126},[3108,3921,3847],{"class":3130},[3108,3923,3174],{"class":3122},[3108,3925,3127],{"class":3126},[3108,3927,3179],{"class":3130},[3108,3929,3182],{"class":3114},[3108,3931,3932,3934,3936],{"class":3110,"line":3185},[3108,3933,3188],{"class":3114},[3108,3935,2987],{"class":3118},[3108,3937,3134],{"class":3114},[3108,3939,3940,3942,3944],{"class":3110,"line":3195},[3108,3941,3198],{"class":3114},[3108,3943,3143],{"class":3118},[3108,3945,3134],{"class":3114},[3108,3947,3948,3950,3952],{"class":3110,"line":3205},[3108,3949,3140],{"class":3114},[3108,3951,3331],{"class":3118},[3108,3953,3134],{"class":3114},[3108,3955,3956,3958,3960,3962,3964,3966],{"class":3110,"line":3336},[3108,3957,3151],{"class":3114},[3108,3959,3341],{"class":3118},[3108,3961,3344],{"class":3122},[3108,3963,3127],{"class":3126},[3108,3965,3349],{"class":3130},[3108,3967,3134],{"class":3114},[3108,3969,3970,3972,3974,3976,3978,3980,3982,3984,3987],{"class":3110,"line":3354},[3108,3971,3161],{"class":3114},[3108,3973,3359],{"class":3118},[3108,3975,3166],{"class":3122},[3108,3977,3127],{"class":3126},[3108,3979,3847],{"class":3130},[3108,3981,3368],{"class":3122},[3108,3983,3127],{"class":3126},[3108,3985,3986],{"class":3130},"\"scale(1.1)\"",[3108,3988,3182],{"class":3114},[3108,3990,3991,3993,3995],{"class":3110,"line":3378},[3108,3992,3188],{"class":3114},[3108,3994,3341],{"class":3118},[3108,3996,3134],{"class":3114},[3108,3998,3999,4001,4003],{"class":3110,"line":3387},[3108,4000,3198],{"class":3114},[3108,4002,3331],{"class":3118},[3108,4004,3134],{"class":3114},[3108,4006,4007,4009,4011],{"class":3110,"line":3396},[3108,4008,3208],{"class":3114},[3108,4010,3119],{"class":3118},[3108,4012,3134],{"class":3114},[2964,4014,4015,4016,4019,4020,3229,4023,3229,4026,3229,4029,4032,4033,3007],{},"Тут використовується CSS-подібний синтаксис ",[2968,4017,4018],{},"scale(1.1)"," для масштабування. Avalonia підтримує функції ",[2968,4021,4022],{},"translate()",[2968,4024,4025],{},"rotate()",[2968,4027,4028],{},"scale()",[2968,4030,4031],{},"skew()"," у властивості ",[2968,4034,3828],{},[3012,4036,4038,4043],{"icon":4037},"lucide:book",[2964,4039,4040,3408],{},[2985,4041,4042],{},"Словник",[4044,4045,4046,4051,4057],"ul",{},[3413,4047,4048,4050],{},[2985,4049,3049],{}," — механізм автоматичної анімації зміни властивості.",[3413,4052,4053,4056],{},[2985,4054,4055],{},"Easing"," — функція пом'якшення, яка визначає темп анімації (лінійний, прискорення, уповільнення тощо).",[3413,4058,4059,4062,4063,3229,4065,3229,4068,4071],{},[2985,4060,4061],{},"Pseudo-class"," — селектор стану елемента (",[2968,4064,3432],{},[2968,4066,4067],{},":pressed",[2968,4069,4070],{},":disabled","), аналог WPF Triggers.",[3034,4073],{},[2959,4075,4077],{"id":4076},"easing-functions-у-avalonia","Easing Functions у Avalonia",[2964,4079,4080],{},"Avalonia підтримує ті ж функції пом'якшення (easing), що й WPF, але з дещо іншими назвами. Ось найпоширеніші:",[4082,4083,4084,4100],"table",{},[4085,4086,4087],"thead",{},[4088,4089,4090,4094,4097],"tr",{},[4091,4092,4093],"th",{},"Avalonia Easing",[4091,4095,4096],{},"Опис",[4091,4098,4099],{},"Аналог у WPF",[4101,4102,4103,4119,4135,4150,4165,4180,4195],"tbody",{},[4088,4104,4105,4111,4114],{},[4106,4107,4108],"td",{},[2968,4109,4110],{},"LinearEasing",[4106,4112,4113],{},"Лінійна анімація без прискорення",[4106,4115,4116],{},[2968,4117,4118],{},"LinearEase",[4088,4120,4121,4126,4129],{},[4106,4122,4123],{},[2968,4124,4125],{},"QuadraticEaseIn",[4106,4127,4128],{},"Прискорення на початку",[4106,4130,4131,4134],{},[2968,4132,4133],{},"QuadraticEase"," (EaseIn)",[4088,4136,4137,4142,4145],{},[4106,4138,4139],{},[2968,4140,4141],{},"QuadraticEaseOut",[4106,4143,4144],{},"Уповільнення в кінці",[4106,4146,4147,4149],{},[2968,4148,4133],{}," (EaseOut)",[4088,4151,4152,4156,4159],{},[4106,4153,4154],{},[2968,4155,3423],{},[4106,4157,4158],{},"Прискорення на початку, уповільнення в кінці",[4106,4160,4161,4164],{},[2968,4162,4163],{},"CubicEase"," (EaseInOut)",[4088,4166,4167,4172,4175],{},[4106,4168,4169],{},[2968,4170,4171],{},"BackEaseOut",[4106,4173,4174],{},"\"Відскок\" в кінці анімації",[4106,4176,4177,4149],{},[2968,4178,4179],{},"BackEase",[4088,4181,4182,4187,4190],{},[4106,4183,4184],{},[2968,4185,4186],{},"BounceEaseOut",[4106,4188,4189],{},"Ефект \"стрибка\" в кінці",[4106,4191,4192,4149],{},[2968,4193,4194],{},"BounceEase",[4088,4196,4197,4202,4205],{},[4106,4198,4199],{},[2968,4200,4201],{},"ElasticEaseOut",[4106,4203,4204],{},"Еластичний ефект (як пружина)",[4106,4206,4207,4149],{},[2968,4208,4209],{},"ElasticEase",[2964,4211,3585],{},[3099,4213,4215],{"className":3101,"code":4214,"language":3103,"meta":3104,"style":3104},"\u003CDoubleTransition Property=\"Opacity\" Duration=\"0:0:0.5\" Easing=\"BackEaseOut\"/>\n",[2968,4216,4217],{"__ignoreMap":3104},[3108,4218,4219,4221,4223,4225,4227,4229,4231,4233,4235,4237,4239,4241],{"class":3110,"line":3111},[3108,4220,3115],{"class":3114},[3108,4222,3068],{"class":3118},[3108,4224,3166],{"class":3122},[3108,4226,3127],{"class":3126},[3108,4228,3171],{"class":3130},[3108,4230,3174],{"class":3122},[3108,4232,3127],{"class":3126},[3108,4234,3528],{"class":3130},[3108,4236,3301],{"class":3122},[3108,4238,3127],{"class":3126},[3108,4240,3860],{"class":3130},[3108,4242,3182],{"class":3114},[2964,4244,4245,4246,4248],{},"Функції easing роблять анімації більш природними та приємними для ока. Наприклад, ",[2968,4247,4171],{}," створює ефект \"перельоту\" — елемент трохи виходить за межі кінцевого значення, а потім повертається назад.",[3034,4250],{},[2959,4252,4254],{"id":4253},"css-подібний-підхід-pseudo-classes-та-styles","CSS-подібний підхід: Pseudo-classes та Styles",[2964,4256,4257,4258,4261],{},"Одна з найбільших переваг Avalonia — це інтеграція анімацій зі стилями через ",[2985,4259,4260],{},"pseudo-classes"," (псевдокласи). Це селектори стану елемента, які автоматично застосовуються при певних умовах.",[3041,4263,4265],{"id":4264},"основні-pseudo-classes","Основні Pseudo-classes",[4044,4267,4268,4277,4285,4293,4299],{},[3413,4269,4270,4272,4273,4276],{},[2968,4271,3432],{}," — курсор миші над елементом (аналог WPF ",[2968,4274,4275],{},"IsMouseOver",").",[3413,4278,4279,4281,4282,4276],{},[2968,4280,4067],{}," — елемент натиснутий (аналог ",[2968,4283,4284],{},"IsPressed",[3413,4286,4287,4289,4290,4276],{},[2968,4288,4070],{}," — елемент вимкнений (аналог ",[2968,4291,4292],{},"IsEnabled=False",[3413,4294,4295,4298],{},[2968,4296,4297],{},":focus"," — елемент має фокус клавіатури.",[3413,4300,4301,4304,4305,2979,4308,4311,4312,4276],{},[2968,4302,4303],{},":checked"," — для ",[2968,4306,4307],{},"CheckBox",[2968,4309,4310],{},"RadioButton"," (аналог ",[2968,4313,4314],{},"IsChecked=True",[3041,4316,4318],{"id":4317},"приклад-анімація-кнопки-з-кількома-станами","Приклад: Анімація кнопки з кількома станами",[3099,4320,4322],{"className":3101,"code":4321,"language":3103,"meta":3104,"style":3104},"\u003CButton Content=\"Інтерактивна кнопка\" Opacity=\"1.0\" RenderTransformOrigin=\"0.5, 0.5\">\n    \u003CButton.Transitions>\n        \u003CTransitions>\n            \u003CDoubleTransition Property=\"Opacity\" Duration=\"0:0:0.2\"/>\n            \u003CTransformOperationsTransition Property=\"RenderTransform\" Duration=\"0:0:0.2\"/>\n        \u003C/Transitions>\n    \u003C/Button.Transitions>\n    \u003CButton.Styles>\n        \u003CStyle Selector=\"Button:pointerover\">\n            \u003CSetter Property=\"Opacity\" Value=\"0.8\"/>\n            \u003CSetter Property=\"RenderTransform\" Value=\"scale(1.05)\"/>\n        \u003C/Style>\n        \u003CStyle Selector=\"Button:pressed\">\n            \u003CSetter Property=\"Opacity\" Value=\"0.6\"/>\n            \u003CSetter Property=\"RenderTransform\" Value=\"scale(0.95)\"/>\n        \u003C/Style>\n    \u003C/Button.Styles>\n\u003C/Button>\n",[2968,4323,4324,4351,4359,4367,4388,4408,4416,4424,4432,4446,4467,4488,4496,4511,4533,4555,4564,4573],{"__ignoreMap":3104},[3108,4325,4326,4328,4330,4332,4334,4337,4339,4341,4343,4345,4347,4349],{"class":3110,"line":3111},[3108,4327,3115],{"class":3114},[3108,4329,3119],{"class":3118},[3108,4331,3123],{"class":3122},[3108,4333,3127],{"class":3126},[3108,4335,4336],{"class":3130},"\"Інтерактивна кнопка\"",[3108,4338,3257],{"class":3122},[3108,4340,3127],{"class":3126},[3108,4342,3262],{"class":3130},[3108,4344,3886],{"class":3122},[3108,4346,3127],{"class":3126},[3108,4348,3891],{"class":3130},[3108,4350,3134],{"class":3114},[3108,4352,4353,4355,4357],{"class":3110,"line":3137},[3108,4354,3140],{"class":3114},[3108,4356,3143],{"class":3118},[3108,4358,3134],{"class":3114},[3108,4360,4361,4363,4365],{"class":3110,"line":3148},[3108,4362,3151],{"class":3114},[3108,4364,2987],{"class":3118},[3108,4366,3134],{"class":3114},[3108,4368,4369,4371,4373,4375,4377,4379,4381,4383,4386],{"class":3110,"line":3158},[3108,4370,3161],{"class":3114},[3108,4372,3068],{"class":3118},[3108,4374,3166],{"class":3122},[3108,4376,3127],{"class":3126},[3108,4378,3171],{"class":3130},[3108,4380,3174],{"class":3122},[3108,4382,3127],{"class":3126},[3108,4384,4385],{"class":3130},"\"0:0:0.2\"",[3108,4387,3182],{"class":3114},[3108,4389,4390,4392,4394,4396,4398,4400,4402,4404,4406],{"class":3110,"line":3185},[3108,4391,3161],{"class":3114},[3108,4393,3822],{"class":3118},[3108,4395,3166],{"class":3122},[3108,4397,3127],{"class":3126},[3108,4399,3847],{"class":3130},[3108,4401,3174],{"class":3122},[3108,4403,3127],{"class":3126},[3108,4405,4385],{"class":3130},[3108,4407,3182],{"class":3114},[3108,4409,4410,4412,4414],{"class":3110,"line":3195},[3108,4411,3188],{"class":3114},[3108,4413,2987],{"class":3118},[3108,4415,3134],{"class":3114},[3108,4417,4418,4420,4422],{"class":3110,"line":3205},[3108,4419,3198],{"class":3114},[3108,4421,3143],{"class":3118},[3108,4423,3134],{"class":3114},[3108,4425,4426,4428,4430],{"class":3110,"line":3336},[3108,4427,3140],{"class":3114},[3108,4429,3331],{"class":3118},[3108,4431,3134],{"class":3114},[3108,4433,4434,4436,4438,4440,4442,4444],{"class":3110,"line":3354},[3108,4435,3151],{"class":3114},[3108,4437,3341],{"class":3118},[3108,4439,3344],{"class":3122},[3108,4441,3127],{"class":3126},[3108,4443,3349],{"class":3130},[3108,4445,3134],{"class":3114},[3108,4447,4448,4450,4452,4454,4456,4458,4460,4462,4465],{"class":3110,"line":3378},[3108,4449,3161],{"class":3114},[3108,4451,3359],{"class":3118},[3108,4453,3166],{"class":3122},[3108,4455,3127],{"class":3126},[3108,4457,3171],{"class":3130},[3108,4459,3368],{"class":3122},[3108,4461,3127],{"class":3126},[3108,4463,4464],{"class":3130},"\"0.8\"",[3108,4466,3182],{"class":3114},[3108,4468,4469,4471,4473,4475,4477,4479,4481,4483,4486],{"class":3110,"line":3387},[3108,4470,3161],{"class":3114},[3108,4472,3359],{"class":3118},[3108,4474,3166],{"class":3122},[3108,4476,3127],{"class":3126},[3108,4478,3847],{"class":3130},[3108,4480,3368],{"class":3122},[3108,4482,3127],{"class":3126},[3108,4484,4485],{"class":3130},"\"scale(1.05)\"",[3108,4487,3182],{"class":3114},[3108,4489,4490,4492,4494],{"class":3110,"line":3396},[3108,4491,3188],{"class":3114},[3108,4493,3341],{"class":3118},[3108,4495,3134],{"class":3114},[3108,4497,4498,4500,4502,4504,4506,4509],{"class":3110,"line":3756},[3108,4499,3151],{"class":3114},[3108,4501,3341],{"class":3118},[3108,4503,3344],{"class":3122},[3108,4505,3127],{"class":3126},[3108,4507,4508],{"class":3130},"\"Button:pressed\"",[3108,4510,3134],{"class":3114},[3108,4512,4514,4516,4518,4520,4522,4524,4526,4528,4531],{"class":3110,"line":4513},14,[3108,4515,3161],{"class":3114},[3108,4517,3359],{"class":3118},[3108,4519,3166],{"class":3122},[3108,4521,3127],{"class":3126},[3108,4523,3171],{"class":3130},[3108,4525,3368],{"class":3122},[3108,4527,3127],{"class":3126},[3108,4529,4530],{"class":3130},"\"0.6\"",[3108,4532,3182],{"class":3114},[3108,4534,4536,4538,4540,4542,4544,4546,4548,4550,4553],{"class":3110,"line":4535},15,[3108,4537,3161],{"class":3114},[3108,4539,3359],{"class":3118},[3108,4541,3166],{"class":3122},[3108,4543,3127],{"class":3126},[3108,4545,3847],{"class":3130},[3108,4547,3368],{"class":3122},[3108,4549,3127],{"class":3126},[3108,4551,4552],{"class":3130},"\"scale(0.95)\"",[3108,4554,3182],{"class":3114},[3108,4556,4558,4560,4562],{"class":3110,"line":4557},16,[3108,4559,3188],{"class":3114},[3108,4561,3341],{"class":3118},[3108,4563,3134],{"class":3114},[3108,4565,4567,4569,4571],{"class":3110,"line":4566},17,[3108,4568,3198],{"class":3114},[3108,4570,3331],{"class":3118},[3108,4572,3134],{"class":3114},[3108,4574,4576,4578,4580],{"class":3110,"line":4575},18,[3108,4577,3208],{"class":3114},[3108,4579,3119],{"class":3118},[3108,4581,3134],{"class":3114},[2964,4583,4584,3408],{},[2985,4585,4586],{},"Що відбувається",[3410,4588,4589,4605,4620],{},[3413,4590,4591,4594,4595,4597,4598,4601,4602,3007],{},[2985,4592,4593],{},"Hover"," (",[2968,4596,3432],{},"): Прозорість зменшується до ",[2968,4599,4600],{},"0.8",", кнопка збільшується до ",[2968,4603,4604],{},"105%",[3413,4606,4607,4594,4610,4597,4612,4615,4616,4619],{},[2985,4608,4609],{},"Pressed",[2968,4611,4067],{},[2968,4613,4614],{},"0.6",", кнопка зменшується до ",[2968,4617,4618],{},"95%"," (ефект \"натискання\").",[3413,4621,4622,4624,4625,2979,4627,4629],{},[2985,4623,2987],{},": Обидві властивості (",[2968,4626,3056],{},[2968,4628,3828],{},") анімуються плавно.",[2964,4631,4632,4633,3028,4636,4639,4640,3028,4642,4644],{},"Це всього 15 рядків XAML. У WPF аналогічний ефект вимагав би ",[2968,4634,4635],{},"ControlTemplate",[2968,4637,4638],{},"VisualStateManager"," або кілька ",[2968,4641,3228],{},[2968,4643,2970],{}," — близько 40-50 рядків коду.",[3467,4646,4648,4650,4651,4653,4654,4657],{"icon":4647},"lucide:zap",[2985,4649,3472],{},": Використовуйте ",[2968,4652,3432],{}," замість ",[2968,4655,4656],{},":mouseover"," — це працює як з мишею, так і з сенсорними екранами.",[3034,4659],{},[2959,4661,4663],{"id":4662},"keyframe-animations-складні-сценарії","KeyFrame Animations — складні сценарії",[2964,4665,4666,4667,4669],{},"Хоча ",[2968,4668,2987],{}," чудово підходять для простих анімацій (зміна однієї властивості з A на B), іноді потрібні складніші сценарії — наприклад, анімація з кількома етапами, зміна кількох властивостей одночасно, або анімація, яка запускається програмно (не через зміну властивості).",[2964,4671,4672,4673,4676,4677,4679],{},"Для таких випадків Avalonia надає ",[2985,4674,4675],{},"KeyFrame Animations"," — механізм, схожий на WPF ",[2968,4678,2970],{},", але з більш зручним API.",[3041,4681,4683],{"id":4682},"структура-keyframe-animation","Структура KeyFrame Animation",[2964,4685,4686],{},"KeyFrame анімація складається з:",[3410,4688,4689,4694,4702],{},[3413,4690,4691,4693],{},[2985,4692,3027],{}," — контейнер, який визначає тривалість, режим повторення, затримку.",[3413,4695,4696,4698,4699,4276],{},[2985,4697,3031],{}," — ключовий кадр, який визначає стан властивостей у певний момент часу (через ",[2968,4700,4701],{},"Cue",[3413,4703,4704,4706],{},[2985,4705,3359],{}," — встановлення значення властивості у цьому кадрі.",[2964,4708,3097],{},[3099,4710,4712],{"className":3101,"code":4711,"language":3103,"meta":3104,"style":3104},"\u003CAnimation Duration=\"0:0:2\" IterationCount=\"Infinite\">\n    \u003CKeyFrame Cue=\"0%\">\n        \u003CSetter Property=\"Opacity\" Value=\"1.0\"/>\n    \u003C/KeyFrame>\n    \u003CKeyFrame Cue=\"50%\">\n        \u003CSetter Property=\"Opacity\" Value=\"0.3\"/>\n    \u003C/KeyFrame>\n    \u003CKeyFrame Cue=\"100%\">\n        \u003CSetter Property=\"Opacity\" Value=\"1.0\"/>\n    \u003C/KeyFrame>\n\u003C/Animation>\n",[2968,4713,4714,4737,4753,4773,4781,4796,4817,4825,4840,4860,4868],{"__ignoreMap":3104},[3108,4715,4716,4718,4720,4722,4724,4727,4730,4732,4735],{"class":3110,"line":3111},[3108,4717,3115],{"class":3114},[3108,4719,3027],{"class":3118},[3108,4721,3174],{"class":3122},[3108,4723,3127],{"class":3126},[3108,4725,4726],{"class":3130},"\"0:0:2\"",[3108,4728,4729],{"class":3122}," IterationCount",[3108,4731,3127],{"class":3126},[3108,4733,4734],{"class":3130},"\"Infinite\"",[3108,4736,3134],{"class":3114},[3108,4738,4739,4741,4743,4746,4748,4751],{"class":3110,"line":3137},[3108,4740,3140],{"class":3114},[3108,4742,3031],{"class":3118},[3108,4744,4745],{"class":3122}," Cue",[3108,4747,3127],{"class":3126},[3108,4749,4750],{"class":3130},"\"0%\"",[3108,4752,3134],{"class":3114},[3108,4754,4755,4757,4759,4761,4763,4765,4767,4769,4771],{"class":3110,"line":3148},[3108,4756,3151],{"class":3114},[3108,4758,3359],{"class":3118},[3108,4760,3166],{"class":3122},[3108,4762,3127],{"class":3126},[3108,4764,3171],{"class":3130},[3108,4766,3368],{"class":3122},[3108,4768,3127],{"class":3126},[3108,4770,3262],{"class":3130},[3108,4772,3182],{"class":3114},[3108,4774,4775,4777,4779],{"class":3110,"line":3158},[3108,4776,3198],{"class":3114},[3108,4778,3031],{"class":3118},[3108,4780,3134],{"class":3114},[3108,4782,4783,4785,4787,4789,4791,4794],{"class":3110,"line":3185},[3108,4784,3140],{"class":3114},[3108,4786,3031],{"class":3118},[3108,4788,4745],{"class":3122},[3108,4790,3127],{"class":3126},[3108,4792,4793],{"class":3130},"\"50%\"",[3108,4795,3134],{"class":3114},[3108,4797,4798,4800,4802,4804,4806,4808,4810,4812,4815],{"class":3110,"line":3195},[3108,4799,3151],{"class":3114},[3108,4801,3359],{"class":3118},[3108,4803,3166],{"class":3122},[3108,4805,3127],{"class":3126},[3108,4807,3171],{"class":3130},[3108,4809,3368],{"class":3122},[3108,4811,3127],{"class":3126},[3108,4813,4814],{"class":3130},"\"0.3\"",[3108,4816,3182],{"class":3114},[3108,4818,4819,4821,4823],{"class":3110,"line":3205},[3108,4820,3198],{"class":3114},[3108,4822,3031],{"class":3118},[3108,4824,3134],{"class":3114},[3108,4826,4827,4829,4831,4833,4835,4838],{"class":3110,"line":3336},[3108,4828,3140],{"class":3114},[3108,4830,3031],{"class":3118},[3108,4832,4745],{"class":3122},[3108,4834,3127],{"class":3126},[3108,4836,4837],{"class":3130},"\"100%\"",[3108,4839,3134],{"class":3114},[3108,4841,4842,4844,4846,4848,4850,4852,4854,4856,4858],{"class":3110,"line":3354},[3108,4843,3151],{"class":3114},[3108,4845,3359],{"class":3118},[3108,4847,3166],{"class":3122},[3108,4849,3127],{"class":3126},[3108,4851,3171],{"class":3130},[3108,4853,3368],{"class":3122},[3108,4855,3127],{"class":3126},[3108,4857,3262],{"class":3130},[3108,4859,3182],{"class":3114},[3108,4861,4862,4864,4866],{"class":3110,"line":3378},[3108,4863,3198],{"class":3114},[3108,4865,3031],{"class":3118},[3108,4867,3134],{"class":3114},[3108,4869,4870,4872,4874],{"class":3110,"line":3387},[3108,4871,3208],{"class":3114},[3108,4873,3027],{"class":3118},[3108,4875,3134],{"class":3114},[2964,4877,4878,3408],{},[2985,4879,3407],{},[4044,4881,4882,4888,4898,4915],{},[3413,4883,4884,4887],{},[2985,4885,4886],{},"Duration",": Загальна тривалість анімації — 2 секунди.",[3413,4889,4890,4893,4894,4897],{},[2985,4891,4892],{},"IterationCount",": Кількість повторень. ",[2968,4895,4896],{},"Infinite"," означає нескінченне повторення.",[3413,4899,4900,4902,4903,4906,4907,4910,4911,4914],{},[2985,4901,4701],{},": Відсоток часу анімації. ",[2968,4904,4905],{},"0%"," — початок, ",[2968,4908,4909],{},"50%"," — середина, ",[2968,4912,4913],{},"100%"," — кінець.",[3413,4916,4917,4919],{},[2985,4918,3359],{},": Встановлює значення властивості у цьому кадрі.",[2964,4921,4922,4923,4925,4926,3454,4928,4931,4932,3454,4934,4936],{},"Результат: ",[2968,4924,3056],{}," плавно змінюється від ",[2968,4927,3060],{},[2968,4929,4930],{},"0.3"," (перша половина анімації), потім від ",[2968,4933,4930],{},[2968,4935,3060],{}," (друга половина). Анімація повторюється нескінченно — ефект \"пульсації\".",[3041,4938,4940],{"id":4939},"приклад-обертання-елемента","Приклад: Обертання елемента",[2964,4942,4943],{},"Створимо анімацію обертання іконки на 360 градусів:",[3099,4945,4947],{"className":3101,"code":4946,"language":3103,"meta":3104,"style":3104},"\u003CBorder Width=\"100\" Height=\"100\" Background=\"DodgerBlue\" CornerRadius=\"50\"\n        RenderTransformOrigin=\"0.5, 0.5\">\n    \u003CBorder.Styles>\n        \u003CStyle Selector=\"Border\">\n            \u003CStyle.Animations>\n                \u003CAnimation Duration=\"0:0:2\" IterationCount=\"Infinite\">\n                    \u003CKeyFrame Cue=\"0%\">\n                        \u003CSetter Property=\"RenderTransform\" Value=\"rotate(0deg)\"/>\n                    \u003C/KeyFrame>\n                    \u003CKeyFrame Cue=\"100%\">\n                        \u003CSetter Property=\"RenderTransform\" Value=\"rotate(360deg)\"/>\n                    \u003C/KeyFrame>\n                \u003C/Animation>\n            \u003C/Style.Animations>\n        \u003C/Style>\n    \u003C/Border.Styles>\n    \u003CTextBlock Text=\"🔄\" FontSize=\"48\" HorizontalAlignment=\"Center\" VerticalAlignment=\"Center\"/>\n\u003C/Border>\n",[2968,4948,4949,4984,4995,5003,5018,5027,5048,5063,5085,5094,5108,5129,5137,5146,5155,5163,5171,5209],{"__ignoreMap":3104},[3108,4950,4951,4953,4955,4958,4960,4963,4966,4968,4970,4972,4974,4977,4979,4981],{"class":3110,"line":3111},[3108,4952,3115],{"class":3114},[3108,4954,3597],{"class":3118},[3108,4956,4957],{"class":3122}," Width",[3108,4959,3127],{"class":3126},[3108,4961,4962],{"class":3130},"\"100\"",[3108,4964,4965],{"class":3122}," Height",[3108,4967,3127],{"class":3126},[3108,4969,4962],{"class":3130},[3108,4971,3600],{"class":3122},[3108,4973,3127],{"class":3126},[3108,4975,4976],{"class":3130},"\"DodgerBlue\"",[3108,4978,3608],{"class":3122},[3108,4980,3127],{"class":3126},[3108,4982,4983],{"class":3130},"\"50\"\n",[3108,4985,4986,4989,4991,4993],{"class":3110,"line":3137},[3108,4987,4988],{"class":3122},"        RenderTransformOrigin",[3108,4990,3127],{"class":3126},[3108,4992,3891],{"class":3130},[3108,4994,3134],{"class":3114},[3108,4996,4997,4999,5001],{"class":3110,"line":3148},[3108,4998,3140],{"class":3114},[3108,5000,3683],{"class":3118},[3108,5002,3134],{"class":3114},[3108,5004,5005,5007,5009,5011,5013,5016],{"class":3110,"line":3158},[3108,5006,3151],{"class":3114},[3108,5008,3341],{"class":3118},[3108,5010,3344],{"class":3122},[3108,5012,3127],{"class":3126},[3108,5014,5015],{"class":3130},"\"Border\"",[3108,5017,3134],{"class":3114},[3108,5019,5020,5022,5025],{"class":3110,"line":3185},[3108,5021,3161],{"class":3114},[3108,5023,5024],{"class":3118},"Style.Animations",[3108,5026,3134],{"class":3114},[3108,5028,5029,5032,5034,5036,5038,5040,5042,5044,5046],{"class":3110,"line":3195},[3108,5030,5031],{"class":3114},"                \u003C",[3108,5033,3027],{"class":3118},[3108,5035,3174],{"class":3122},[3108,5037,3127],{"class":3126},[3108,5039,4726],{"class":3130},[3108,5041,4729],{"class":3122},[3108,5043,3127],{"class":3126},[3108,5045,4734],{"class":3130},[3108,5047,3134],{"class":3114},[3108,5049,5050,5053,5055,5057,5059,5061],{"class":3110,"line":3205},[3108,5051,5052],{"class":3114},"                    \u003C",[3108,5054,3031],{"class":3118},[3108,5056,4745],{"class":3122},[3108,5058,3127],{"class":3126},[3108,5060,4750],{"class":3130},[3108,5062,3134],{"class":3114},[3108,5064,5065,5068,5070,5072,5074,5076,5078,5080,5083],{"class":3110,"line":3336},[3108,5066,5067],{"class":3114},"                        \u003C",[3108,5069,3359],{"class":3118},[3108,5071,3166],{"class":3122},[3108,5073,3127],{"class":3126},[3108,5075,3847],{"class":3130},[3108,5077,3368],{"class":3122},[3108,5079,3127],{"class":3126},[3108,5081,5082],{"class":3130},"\"rotate(0deg)\"",[3108,5084,3182],{"class":3114},[3108,5086,5087,5090,5092],{"class":3110,"line":3354},[3108,5088,5089],{"class":3114},"                    \u003C/",[3108,5091,3031],{"class":3118},[3108,5093,3134],{"class":3114},[3108,5095,5096,5098,5100,5102,5104,5106],{"class":3110,"line":3378},[3108,5097,5052],{"class":3114},[3108,5099,3031],{"class":3118},[3108,5101,4745],{"class":3122},[3108,5103,3127],{"class":3126},[3108,5105,4837],{"class":3130},[3108,5107,3134],{"class":3114},[3108,5109,5110,5112,5114,5116,5118,5120,5122,5124,5127],{"class":3110,"line":3387},[3108,5111,5067],{"class":3114},[3108,5113,3359],{"class":3118},[3108,5115,3166],{"class":3122},[3108,5117,3127],{"class":3126},[3108,5119,3847],{"class":3130},[3108,5121,3368],{"class":3122},[3108,5123,3127],{"class":3126},[3108,5125,5126],{"class":3130},"\"rotate(360deg)\"",[3108,5128,3182],{"class":3114},[3108,5130,5131,5133,5135],{"class":3110,"line":3396},[3108,5132,5089],{"class":3114},[3108,5134,3031],{"class":3118},[3108,5136,3134],{"class":3114},[3108,5138,5139,5142,5144],{"class":3110,"line":3756},[3108,5140,5141],{"class":3114},"                \u003C/",[3108,5143,3027],{"class":3118},[3108,5145,3134],{"class":3114},[3108,5147,5148,5151,5153],{"class":3110,"line":4513},[3108,5149,5150],{"class":3114},"            \u003C/",[3108,5152,5024],{"class":3118},[3108,5154,3134],{"class":3114},[3108,5156,5157,5159,5161],{"class":3110,"line":4535},[3108,5158,3188],{"class":3114},[3108,5160,3341],{"class":3118},[3108,5162,3134],{"class":3114},[3108,5164,5165,5167,5169],{"class":3110,"line":4557},[3108,5166,3198],{"class":3114},[3108,5168,3683],{"class":3118},[3108,5170,3134],{"class":3114},[3108,5172,5173,5175,5177,5179,5181,5184,5187,5189,5192,5195,5197,5200,5203,5205,5207],{"class":3110,"line":4566},[3108,5174,3140],{"class":3114},[3108,5176,3744],{"class":3118},[3108,5178,3747],{"class":3122},[3108,5180,3127],{"class":3126},[3108,5182,5183],{"class":3130},"\"🔄\"",[3108,5185,5186],{"class":3122}," FontSize",[3108,5188,3127],{"class":3126},[3108,5190,5191],{"class":3130},"\"48\"",[3108,5193,5194],{"class":3122}," HorizontalAlignment",[3108,5196,3127],{"class":3126},[3108,5198,5199],{"class":3130},"\"Center\"",[3108,5201,5202],{"class":3122}," VerticalAlignment",[3108,5204,3127],{"class":3126},[3108,5206,5199],{"class":3130},[3108,5208,3182],{"class":3114},[3108,5210,5211,5213,5215],{"class":3110,"line":4575},[3108,5212,3208],{"class":3114},[3108,5214,3597],{"class":3118},[3108,5216,3134],{"class":3114},[2964,5218,5219,3408],{},[2985,5220,5221],{},"Важливі моменти",[4044,5223,5224,5229,5239],{},[3413,5225,5226,5228],{},[2985,5227,5024],{},": KeyFrame анімації визначаються всередині стилю. Це означає, що анімація застосовується автоматично при завантаженні елемента.",[3413,5230,5231,5234,5235,5238],{},[2985,5232,5233],{},"RenderTransformOrigin",": Встановлено на ",[2968,5236,5237],{},"0.5, 0.5"," (центр елемента), щоб обертання відбувалося навколо центру, а не лівого верхнього кута.",[3413,5240,5241,5244,5245,5248],{},[2985,5242,5243],{},"rotate(0deg)"," → ",[2985,5246,5247],{},"rotate(360deg)",": CSS-подібний синтаксис для обертання.",[3041,5250,5252],{"id":5251},"приклад-складна-анімація-з-кількома-властивостями","Приклад: Складна анімація з кількома властивостями",[2964,5254,5255],{},"Створимо анімацію, яка одночасно змінює розмір, прозорість та колір фону:",[3099,5257,5259],{"className":3101,"code":5258,"language":3103,"meta":3104,"style":3104},"\u003CBorder Width=\"100\" Height=\"100\" Background=\"LightGreen\" CornerRadius=\"8\"\n        RenderTransformOrigin=\"0.5, 0.5\" Opacity=\"1.0\">\n    \u003CBorder.Styles>\n        \u003CStyle Selector=\"Border\">\n            \u003CStyle.Animations>\n                \u003CAnimation Duration=\"0:0:3\" IterationCount=\"Infinite\">\n                    \u003CKeyFrame Cue=\"0%\">\n                        \u003CSetter Property=\"Opacity\" Value=\"1.0\"/>\n                        \u003CSetter Property=\"RenderTransform\" Value=\"scale(1.0)\"/>\n                        \u003CSetter Property=\"Background\" Value=\"LightGreen\"/>\n                    \u003C/KeyFrame>\n                    \u003CKeyFrame Cue=\"50%\">\n                        \u003CSetter Property=\"Opacity\" Value=\"0.5\"/>\n                        \u003CSetter Property=\"RenderTransform\" Value=\"scale(1.3)\"/>\n                        \u003CSetter Property=\"Background\" Value=\"LightCoral\"/>\n                    \u003C/KeyFrame>\n                    \u003CKeyFrame Cue=\"100%\">\n                        \u003CSetter Property=\"Opacity\" Value=\"1.0\"/>\n                        \u003CSetter Property=\"RenderTransform\" Value=\"scale(1.0)\"/>\n                        \u003CSetter Property=\"Background\" Value=\"LightGreen\"/>\n                    \u003C/KeyFrame>\n                \u003C/Animation>\n            \u003C/Style.Animations>\n        \u003C/Style>\n    \u003C/Border.Styles>\n    \u003CTextBlock Text=\"✨\" FontSize=\"36\" HorizontalAlignment=\"Center\" VerticalAlignment=\"Center\"/>\n\u003C/Border>\n",[2968,5260,5261,5293,5309,5317,5331,5339,5360,5374,5394,5415,5435,5443,5457,5478,5499,5519,5527,5541,5561,5582,5603,5612,5621,5630,5639,5648,5683],{"__ignoreMap":3104},[3108,5262,5263,5265,5267,5269,5271,5273,5275,5277,5279,5281,5283,5286,5288,5290],{"class":3110,"line":3111},[3108,5264,3115],{"class":3114},[3108,5266,3597],{"class":3118},[3108,5268,4957],{"class":3122},[3108,5270,3127],{"class":3126},[3108,5272,4962],{"class":3130},[3108,5274,4965],{"class":3122},[3108,5276,3127],{"class":3126},[3108,5278,4962],{"class":3130},[3108,5280,3600],{"class":3122},[3108,5282,3127],{"class":3126},[3108,5284,5285],{"class":3130},"\"LightGreen\"",[3108,5287,3608],{"class":3122},[3108,5289,3127],{"class":3126},[3108,5291,5292],{"class":3130},"\"8\"\n",[3108,5294,5295,5297,5299,5301,5303,5305,5307],{"class":3110,"line":3137},[3108,5296,4988],{"class":3122},[3108,5298,3127],{"class":3126},[3108,5300,3891],{"class":3130},[3108,5302,3257],{"class":3122},[3108,5304,3127],{"class":3126},[3108,5306,3262],{"class":3130},[3108,5308,3134],{"class":3114},[3108,5310,5311,5313,5315],{"class":3110,"line":3148},[3108,5312,3140],{"class":3114},[3108,5314,3683],{"class":3118},[3108,5316,3134],{"class":3114},[3108,5318,5319,5321,5323,5325,5327,5329],{"class":3110,"line":3158},[3108,5320,3151],{"class":3114},[3108,5322,3341],{"class":3118},[3108,5324,3344],{"class":3122},[3108,5326,3127],{"class":3126},[3108,5328,5015],{"class":3130},[3108,5330,3134],{"class":3114},[3108,5332,5333,5335,5337],{"class":3110,"line":3185},[3108,5334,3161],{"class":3114},[3108,5336,5024],{"class":3118},[3108,5338,3134],{"class":3114},[3108,5340,5341,5343,5345,5347,5349,5352,5354,5356,5358],{"class":3110,"line":3195},[3108,5342,5031],{"class":3114},[3108,5344,3027],{"class":3118},[3108,5346,3174],{"class":3122},[3108,5348,3127],{"class":3126},[3108,5350,5351],{"class":3130},"\"0:0:3\"",[3108,5353,4729],{"class":3122},[3108,5355,3127],{"class":3126},[3108,5357,4734],{"class":3130},[3108,5359,3134],{"class":3114},[3108,5361,5362,5364,5366,5368,5370,5372],{"class":3110,"line":3205},[3108,5363,5052],{"class":3114},[3108,5365,3031],{"class":3118},[3108,5367,4745],{"class":3122},[3108,5369,3127],{"class":3126},[3108,5371,4750],{"class":3130},[3108,5373,3134],{"class":3114},[3108,5375,5376,5378,5380,5382,5384,5386,5388,5390,5392],{"class":3110,"line":3336},[3108,5377,5067],{"class":3114},[3108,5379,3359],{"class":3118},[3108,5381,3166],{"class":3122},[3108,5383,3127],{"class":3126},[3108,5385,3171],{"class":3130},[3108,5387,3368],{"class":3122},[3108,5389,3127],{"class":3126},[3108,5391,3262],{"class":3130},[3108,5393,3182],{"class":3114},[3108,5395,5396,5398,5400,5402,5404,5406,5408,5410,5413],{"class":3110,"line":3354},[3108,5397,5067],{"class":3114},[3108,5399,3359],{"class":3118},[3108,5401,3166],{"class":3122},[3108,5403,3127],{"class":3126},[3108,5405,3847],{"class":3130},[3108,5407,3368],{"class":3122},[3108,5409,3127],{"class":3126},[3108,5411,5412],{"class":3130},"\"scale(1.0)\"",[3108,5414,3182],{"class":3114},[3108,5416,5417,5419,5421,5423,5425,5427,5429,5431,5433],{"class":3110,"line":3378},[3108,5418,5067],{"class":3114},[3108,5420,3359],{"class":3118},[3108,5422,3166],{"class":3122},[3108,5424,3127],{"class":3126},[3108,5426,3573],{"class":3130},[3108,5428,3368],{"class":3122},[3108,5430,3127],{"class":3126},[3108,5432,5285],{"class":3130},[3108,5434,3182],{"class":3114},[3108,5436,5437,5439,5441],{"class":3110,"line":3387},[3108,5438,5089],{"class":3114},[3108,5440,3031],{"class":3118},[3108,5442,3134],{"class":3114},[3108,5444,5445,5447,5449,5451,5453,5455],{"class":3110,"line":3396},[3108,5446,5052],{"class":3114},[3108,5448,3031],{"class":3118},[3108,5450,4745],{"class":3122},[3108,5452,3127],{"class":3126},[3108,5454,4793],{"class":3130},[3108,5456,3134],{"class":3114},[3108,5458,5459,5461,5463,5465,5467,5469,5471,5473,5476],{"class":3110,"line":3756},[3108,5460,5067],{"class":3114},[3108,5462,3359],{"class":3118},[3108,5464,3166],{"class":3122},[3108,5466,3127],{"class":3126},[3108,5468,3171],{"class":3130},[3108,5470,3368],{"class":3122},[3108,5472,3127],{"class":3126},[3108,5474,5475],{"class":3130},"\"0.5\"",[3108,5477,3182],{"class":3114},[3108,5479,5480,5482,5484,5486,5488,5490,5492,5494,5497],{"class":3110,"line":4513},[3108,5481,5067],{"class":3114},[3108,5483,3359],{"class":3118},[3108,5485,3166],{"class":3122},[3108,5487,3127],{"class":3126},[3108,5489,3847],{"class":3130},[3108,5491,3368],{"class":3122},[3108,5493,3127],{"class":3126},[3108,5495,5496],{"class":3130},"\"scale(1.3)\"",[3108,5498,3182],{"class":3114},[3108,5500,5501,5503,5505,5507,5509,5511,5513,5515,5517],{"class":3110,"line":4535},[3108,5502,5067],{"class":3114},[3108,5504,3359],{"class":3118},[3108,5506,3166],{"class":3122},[3108,5508,3127],{"class":3126},[3108,5510,3573],{"class":3130},[3108,5512,3368],{"class":3122},[3108,5514,3127],{"class":3126},[3108,5516,3719],{"class":3130},[3108,5518,3182],{"class":3114},[3108,5520,5521,5523,5525],{"class":3110,"line":4557},[3108,5522,5089],{"class":3114},[3108,5524,3031],{"class":3118},[3108,5526,3134],{"class":3114},[3108,5528,5529,5531,5533,5535,5537,5539],{"class":3110,"line":4566},[3108,5530,5052],{"class":3114},[3108,5532,3031],{"class":3118},[3108,5534,4745],{"class":3122},[3108,5536,3127],{"class":3126},[3108,5538,4837],{"class":3130},[3108,5540,3134],{"class":3114},[3108,5542,5543,5545,5547,5549,5551,5553,5555,5557,5559],{"class":3110,"line":4575},[3108,5544,5067],{"class":3114},[3108,5546,3359],{"class":3118},[3108,5548,3166],{"class":3122},[3108,5550,3127],{"class":3126},[3108,5552,3171],{"class":3130},[3108,5554,3368],{"class":3122},[3108,5556,3127],{"class":3126},[3108,5558,3262],{"class":3130},[3108,5560,3182],{"class":3114},[3108,5562,5564,5566,5568,5570,5572,5574,5576,5578,5580],{"class":3110,"line":5563},19,[3108,5565,5067],{"class":3114},[3108,5567,3359],{"class":3118},[3108,5569,3166],{"class":3122},[3108,5571,3127],{"class":3126},[3108,5573,3847],{"class":3130},[3108,5575,3368],{"class":3122},[3108,5577,3127],{"class":3126},[3108,5579,5412],{"class":3130},[3108,5581,3182],{"class":3114},[3108,5583,5585,5587,5589,5591,5593,5595,5597,5599,5601],{"class":3110,"line":5584},20,[3108,5586,5067],{"class":3114},[3108,5588,3359],{"class":3118},[3108,5590,3166],{"class":3122},[3108,5592,3127],{"class":3126},[3108,5594,3573],{"class":3130},[3108,5596,3368],{"class":3122},[3108,5598,3127],{"class":3126},[3108,5600,5285],{"class":3130},[3108,5602,3182],{"class":3114},[3108,5604,5606,5608,5610],{"class":3110,"line":5605},21,[3108,5607,5089],{"class":3114},[3108,5609,3031],{"class":3118},[3108,5611,3134],{"class":3114},[3108,5613,5615,5617,5619],{"class":3110,"line":5614},22,[3108,5616,5141],{"class":3114},[3108,5618,3027],{"class":3118},[3108,5620,3134],{"class":3114},[3108,5622,5624,5626,5628],{"class":3110,"line":5623},23,[3108,5625,5150],{"class":3114},[3108,5627,5024],{"class":3118},[3108,5629,3134],{"class":3114},[3108,5631,5633,5635,5637],{"class":3110,"line":5632},24,[3108,5634,3188],{"class":3114},[3108,5636,3341],{"class":3118},[3108,5638,3134],{"class":3114},[3108,5640,5642,5644,5646],{"class":3110,"line":5641},25,[3108,5643,3198],{"class":3114},[3108,5645,3683],{"class":3118},[3108,5647,3134],{"class":3114},[3108,5649,5651,5653,5655,5657,5659,5662,5664,5666,5669,5671,5673,5675,5677,5679,5681],{"class":3110,"line":5650},26,[3108,5652,3140],{"class":3114},[3108,5654,3744],{"class":3118},[3108,5656,3747],{"class":3122},[3108,5658,3127],{"class":3126},[3108,5660,5661],{"class":3130},"\"✨\"",[3108,5663,5186],{"class":3122},[3108,5665,3127],{"class":3126},[3108,5667,5668],{"class":3130},"\"36\"",[3108,5670,5194],{"class":3122},[3108,5672,3127],{"class":3126},[3108,5674,5199],{"class":3130},[3108,5676,5202],{"class":3122},[3108,5678,3127],{"class":3126},[3108,5680,5199],{"class":3130},[3108,5682,3182],{"class":3114},[3108,5684,5686,5688,5690],{"class":3110,"line":5685},27,[3108,5687,3208],{"class":3114},[3108,5689,3597],{"class":3118},[3108,5691,3134],{"class":3114},[2964,5693,5694],{},"Ця анімація створює ефект \"дихання\" — елемент збільшується, стає напівпрозорим та змінює колір, потім повертається до початкового стану.",[3012,5696,5697,5699,5700,5702,5703,5705,5706,5709,5710,5713],{"icon":3014},[2985,5698,3017],{},": KeyFrame анімації у Avalonia не потребують ",[2968,5701,2982],{}," або ",[2968,5704,2978],{}," у форматі ",[2968,5707,5708],{},"(Button.Opacity)",", як у WPF. Просто вказуєте ",[2968,5711,5712],{},"Property=\"Opacity\""," — набагато простіше!",[3041,5715,5717],{"id":5716},"програмне-керування-анімаціями","Програмне керування анімаціями",[2964,5719,5720,5721,5723],{},"На відміну від ",[2968,5722,2987],{},", які запускаються автоматично, KeyFrame анімації можна запускати програмно через код:",[3099,5725,5729],{"className":5726,"code":5727,"language":5728,"meta":3104,"style":3104},"language-csharp shiki shiki-themes light-plus dark-plus dark-plus","// У ViewModel або Code-Behind\nvar animation = new Animation\n{\n    Duration = TimeSpan.FromSeconds(1),\n    Children =\n    {\n        new KeyFrame\n        {\n            Cue = new Cue(0),\n            Setters = { new Setter(OpacityProperty, 0.0) }\n        },\n        new KeyFrame\n        {\n            Cue = new Cue(1),\n            Setters = { new Setter(OpacityProperty, 1.0) }\n        }\n    }\n};\n\nawait animation.RunAsync(myControl);\n","csharp",[2968,5730,5731,5737,5757,5762,5788,5796,5801,5809,5814,5832,5858,5863,5869,5873,5889,5909,5914,5919,5924,5930],{"__ignoreMap":3104},[3108,5732,5733],{"class":3110,"line":3111},[3108,5734,5736],{"class":5735},"spJ8K","// У ViewModel або Code-Behind\n",[3108,5738,5739,5743,5747,5750,5753],{"class":3110,"line":3137},[3108,5740,5742],{"class":5741},"su1O8","var",[3108,5744,5746],{"class":5745},"siwwj"," animation",[3108,5748,5749],{"class":3126}," = ",[3108,5751,5752],{"class":5741},"new",[3108,5754,5756],{"class":5755},"sN1BT"," Animation\n",[3108,5758,5759],{"class":3110,"line":3148},[3108,5760,5761],{"class":3126},"{\n",[3108,5763,5764,5767,5769,5772,5774,5778,5781,5785],{"class":3110,"line":3158},[3108,5765,5766],{"class":5745},"    Duration",[3108,5768,5749],{"class":3126},[3108,5770,5771],{"class":5745},"TimeSpan",[3108,5773,3007],{"class":3126},[3108,5775,5777],{"class":5776},"s8Opu","FromSeconds",[3108,5779,5780],{"class":3126},"(",[3108,5782,5784],{"class":5783},"sJj4R","1",[3108,5786,5787],{"class":3126},"),\n",[3108,5789,5790,5793],{"class":3110,"line":3185},[3108,5791,5792],{"class":5745},"    Children",[3108,5794,5795],{"class":3126}," =\n",[3108,5797,5798],{"class":3110,"line":3195},[3108,5799,5800],{"class":3126},"    {\n",[3108,5802,5803,5806],{"class":3110,"line":3205},[3108,5804,5805],{"class":5741},"        new",[3108,5807,5808],{"class":5755}," KeyFrame\n",[3108,5810,5811],{"class":3110,"line":3336},[3108,5812,5813],{"class":3126},"        {\n",[3108,5815,5816,5819,5821,5823,5825,5827,5830],{"class":3110,"line":3354},[3108,5817,5818],{"class":5745},"            Cue",[3108,5820,5749],{"class":3126},[3108,5822,5752],{"class":5741},[3108,5824,4745],{"class":5755},[3108,5826,5780],{"class":3126},[3108,5828,5829],{"class":5783},"0",[3108,5831,5787],{"class":3126},[3108,5833,5834,5837,5840,5842,5845,5847,5850,5852,5855],{"class":3110,"line":3378},[3108,5835,5836],{"class":5745},"            Setters",[3108,5838,5839],{"class":3126}," = { ",[3108,5841,5752],{"class":5741},[3108,5843,5844],{"class":5755}," Setter",[3108,5846,5780],{"class":3126},[3108,5848,5849],{"class":5745},"OpacityProperty",[3108,5851,3229],{"class":3126},[3108,5853,5854],{"class":5783},"0.0",[3108,5856,5857],{"class":3126},") }\n",[3108,5859,5860],{"class":3110,"line":3387},[3108,5861,5862],{"class":3126},"        },\n",[3108,5864,5865,5867],{"class":3110,"line":3396},[3108,5866,5805],{"class":5741},[3108,5868,5808],{"class":5755},[3108,5870,5871],{"class":3110,"line":3756},[3108,5872,5813],{"class":3126},[3108,5874,5875,5877,5879,5881,5883,5885,5887],{"class":3110,"line":4513},[3108,5876,5818],{"class":5745},[3108,5878,5749],{"class":3126},[3108,5880,5752],{"class":5741},[3108,5882,4745],{"class":5755},[3108,5884,5780],{"class":3126},[3108,5886,5784],{"class":5783},[3108,5888,5787],{"class":3126},[3108,5890,5891,5893,5895,5897,5899,5901,5903,5905,5907],{"class":3110,"line":4535},[3108,5892,5836],{"class":5745},[3108,5894,5839],{"class":3126},[3108,5896,5752],{"class":5741},[3108,5898,5844],{"class":5755},[3108,5900,5780],{"class":3126},[3108,5902,5849],{"class":5745},[3108,5904,3229],{"class":3126},[3108,5906,3060],{"class":5783},[3108,5908,5857],{"class":3126},[3108,5910,5911],{"class":3110,"line":4557},[3108,5912,5913],{"class":3126},"        }\n",[3108,5915,5916],{"class":3110,"line":4566},[3108,5917,5918],{"class":3126},"    }\n",[3108,5920,5921],{"class":3110,"line":4575},[3108,5922,5923],{"class":3126},"};\n",[3108,5925,5926],{"class":3110,"line":5563},[3108,5927,5929],{"emptyLinePlaceholder":5928},true,"\n",[3108,5931,5932,5935,5937,5939,5942,5944,5947],{"class":3110,"line":5584},[3108,5933,5934],{"class":5741},"await",[3108,5936,5746],{"class":5745},[3108,5938,3007],{"class":3126},[3108,5940,5941],{"class":5776},"RunAsync",[3108,5943,5780],{"class":3126},[3108,5945,5946],{"class":5745},"myControl",[3108,5948,5949],{"class":3126},");\n",[2964,5951,5952,5953,5956,5957,5960],{},"Метод ",[2968,5954,5955],{},"RunAsync()"," запускає анімацію та повертає ",[2968,5958,5959],{},"Task",", який завершується після закінчення анімації. Це зручно для послідовних анімацій або анімацій, які залежать від бізнес-логіки.",[3034,5962],{},[2959,5964,5966],{"id":5965},"порівняння-wpf-storyboard-vs-avalonia-transitions","Порівняння WPF Storyboard vs Avalonia Transitions",[2964,5968,5969],{},"Давайте порівняємо обсяг коду для однієї й тієї ж анімації — зміна прозорості кнопки при наведенні миші.",[3041,5971,5973],{"id":5972},"wpf-storyboard-verbose-explicit","WPF Storyboard (verbose, explicit)",[3099,5975,5977],{"className":3101,"code":5976,"language":3103,"meta":3104,"style":3104},"\u003CButton Content=\"Hover Me\">\n    \u003CButton.Style>\n        \u003CStyle TargetType=\"Button\">\n            \u003CStyle.Triggers>\n                \u003CEventTrigger RoutedEvent=\"MouseEnter\">\n                    \u003CBeginStoryboard>\n                        \u003CStoryboard>\n                            \u003CDoubleAnimation Storyboard.TargetProperty=\"Opacity\"\n                                           To=\"0.7\"\n                                           Duration=\"0:0:0.3\">\n                                \u003CDoubleAnimation.EasingFunction>\n                                    \u003CCubicEase EasingMode=\"EaseInOut\"/>\n                                \u003C/DoubleAnimation.EasingFunction>\n                            \u003C/DoubleAnimation>\n                        \u003C/Storyboard>\n                    \u003C/BeginStoryboard>\n                \u003C/EventTrigger>\n                \u003CEventTrigger RoutedEvent=\"MouseLeave\">\n                    \u003CBeginStoryboard>\n                        \u003CStoryboard>\n                            \u003CDoubleAnimation Storyboard.TargetProperty=\"Opacity\"\n                                           To=\"1.0\"\n                                           Duration=\"0:0:0.3\">\n                                \u003CDoubleAnimation.EasingFunction>\n                                    \u003CCubicEase EasingMode=\"EaseInOut\"/>\n                                \u003C/DoubleAnimation.EasingFunction>\n                            \u003C/DoubleAnimation>\n                        \u003C/Storyboard>\n                    \u003C/BeginStoryboard>\n                \u003C/EventTrigger>\n            \u003C/Style.Triggers>\n        \u003C/Style>\n    \u003C/Button.Style>\n\u003C/Button>\n",[2968,5978,5979,5993,6002,6018,6027,6043,6052,6060,6075,6085,6096,6106,6123,6132,6141,6150,6158,6166,6181,6189,6197,6209,6218,6228,6236,6250,6258,6266,6275,6284,6293,6302,6311,6320],{"__ignoreMap":3104},[3108,5980,5981,5983,5985,5987,5989,5991],{"class":3110,"line":3111},[3108,5982,3115],{"class":3114},[3108,5984,3119],{"class":3118},[3108,5986,3123],{"class":3122},[3108,5988,3127],{"class":3126},[3108,5990,3254],{"class":3130},[3108,5992,3134],{"class":3114},[3108,5994,5995,5997,6000],{"class":3110,"line":3137},[3108,5996,3140],{"class":3114},[3108,5998,5999],{"class":3118},"Button.Style",[3108,6001,3134],{"class":3114},[3108,6003,6004,6006,6008,6011,6013,6016],{"class":3110,"line":3148},[3108,6005,3151],{"class":3114},[3108,6007,3341],{"class":3118},[3108,6009,6010],{"class":3122}," TargetType",[3108,6012,3127],{"class":3126},[3108,6014,6015],{"class":3130},"\"Button\"",[3108,6017,3134],{"class":3114},[3108,6019,6020,6022,6025],{"class":3110,"line":3158},[3108,6021,3161],{"class":3114},[3108,6023,6024],{"class":3118},"Style.Triggers",[3108,6026,3134],{"class":3114},[3108,6028,6029,6031,6033,6036,6038,6041],{"class":3110,"line":3185},[3108,6030,5031],{"class":3114},[3108,6032,3228],{"class":3118},[3108,6034,6035],{"class":3122}," RoutedEvent",[3108,6037,3127],{"class":3126},[3108,6039,6040],{"class":3130},"\"MouseEnter\"",[3108,6042,3134],{"class":3114},[3108,6044,6045,6047,6050],{"class":3110,"line":3195},[3108,6046,5052],{"class":3114},[3108,6048,6049],{"class":3118},"BeginStoryboard",[3108,6051,3134],{"class":3114},[3108,6053,6054,6056,6058],{"class":3110,"line":3205},[3108,6055,5067],{"class":3114},[3108,6057,2970],{"class":3118},[3108,6059,3134],{"class":3114},[3108,6061,6062,6065,6067,6070,6072],{"class":3110,"line":3336},[3108,6063,6064],{"class":3114},"                            \u003C",[3108,6066,2974],{"class":3118},[3108,6068,6069],{"class":3122}," Storyboard.TargetProperty",[3108,6071,3127],{"class":3126},[3108,6073,6074],{"class":3130},"\"Opacity\"\n",[3108,6076,6077,6080,6082],{"class":3110,"line":3354},[3108,6078,6079],{"class":3122},"                                           To",[3108,6081,3127],{"class":3126},[3108,6083,6084],{"class":3130},"\"0.7\"\n",[3108,6086,6087,6090,6092,6094],{"class":3110,"line":3378},[3108,6088,6089],{"class":3122},"                                           Duration",[3108,6091,3127],{"class":3126},[3108,6093,3179],{"class":3130},[3108,6095,3134],{"class":3114},[3108,6097,6098,6101,6104],{"class":3110,"line":3387},[3108,6099,6100],{"class":3114},"                                \u003C",[3108,6102,6103],{"class":3118},"DoubleAnimation.EasingFunction",[3108,6105,3134],{"class":3114},[3108,6107,6108,6111,6113,6116,6118,6121],{"class":3110,"line":3396},[3108,6109,6110],{"class":3114},"                                    \u003C",[3108,6112,4163],{"class":3118},[3108,6114,6115],{"class":3122}," EasingMode",[3108,6117,3127],{"class":3126},[3108,6119,6120],{"class":3130},"\"EaseInOut\"",[3108,6122,3182],{"class":3114},[3108,6124,6125,6128,6130],{"class":3110,"line":3756},[3108,6126,6127],{"class":3114},"                                \u003C/",[3108,6129,6103],{"class":3118},[3108,6131,3134],{"class":3114},[3108,6133,6134,6137,6139],{"class":3110,"line":4513},[3108,6135,6136],{"class":3114},"                            \u003C/",[3108,6138,2974],{"class":3118},[3108,6140,3134],{"class":3114},[3108,6142,6143,6146,6148],{"class":3110,"line":4535},[3108,6144,6145],{"class":3114},"                        \u003C/",[3108,6147,2970],{"class":3118},[3108,6149,3134],{"class":3114},[3108,6151,6152,6154,6156],{"class":3110,"line":4557},[3108,6153,5089],{"class":3114},[3108,6155,6049],{"class":3118},[3108,6157,3134],{"class":3114},[3108,6159,6160,6162,6164],{"class":3110,"line":4566},[3108,6161,5141],{"class":3114},[3108,6163,3228],{"class":3118},[3108,6165,3134],{"class":3114},[3108,6167,6168,6170,6172,6174,6176,6179],{"class":3110,"line":4575},[3108,6169,5031],{"class":3114},[3108,6171,3228],{"class":3118},[3108,6173,6035],{"class":3122},[3108,6175,3127],{"class":3126},[3108,6177,6178],{"class":3130},"\"MouseLeave\"",[3108,6180,3134],{"class":3114},[3108,6182,6183,6185,6187],{"class":3110,"line":5563},[3108,6184,5052],{"class":3114},[3108,6186,6049],{"class":3118},[3108,6188,3134],{"class":3114},[3108,6190,6191,6193,6195],{"class":3110,"line":5584},[3108,6192,5067],{"class":3114},[3108,6194,2970],{"class":3118},[3108,6196,3134],{"class":3114},[3108,6198,6199,6201,6203,6205,6207],{"class":3110,"line":5605},[3108,6200,6064],{"class":3114},[3108,6202,2974],{"class":3118},[3108,6204,6069],{"class":3122},[3108,6206,3127],{"class":3126},[3108,6208,6074],{"class":3130},[3108,6210,6211,6213,6215],{"class":3110,"line":5614},[3108,6212,6079],{"class":3122},[3108,6214,3127],{"class":3126},[3108,6216,6217],{"class":3130},"\"1.0\"\n",[3108,6219,6220,6222,6224,6226],{"class":3110,"line":5623},[3108,6221,6089],{"class":3122},[3108,6223,3127],{"class":3126},[3108,6225,3179],{"class":3130},[3108,6227,3134],{"class":3114},[3108,6229,6230,6232,6234],{"class":3110,"line":5632},[3108,6231,6100],{"class":3114},[3108,6233,6103],{"class":3118},[3108,6235,3134],{"class":3114},[3108,6237,6238,6240,6242,6244,6246,6248],{"class":3110,"line":5641},[3108,6239,6110],{"class":3114},[3108,6241,4163],{"class":3118},[3108,6243,6115],{"class":3122},[3108,6245,3127],{"class":3126},[3108,6247,6120],{"class":3130},[3108,6249,3182],{"class":3114},[3108,6251,6252,6254,6256],{"class":3110,"line":5650},[3108,6253,6127],{"class":3114},[3108,6255,6103],{"class":3118},[3108,6257,3134],{"class":3114},[3108,6259,6260,6262,6264],{"class":3110,"line":5685},[3108,6261,6136],{"class":3114},[3108,6263,2974],{"class":3118},[3108,6265,3134],{"class":3114},[3108,6267,6269,6271,6273],{"class":3110,"line":6268},28,[3108,6270,6145],{"class":3114},[3108,6272,2970],{"class":3118},[3108,6274,3134],{"class":3114},[3108,6276,6278,6280,6282],{"class":3110,"line":6277},29,[3108,6279,5089],{"class":3114},[3108,6281,6049],{"class":3118},[3108,6283,3134],{"class":3114},[3108,6285,6287,6289,6291],{"class":3110,"line":6286},30,[3108,6288,5141],{"class":3114},[3108,6290,3228],{"class":3118},[3108,6292,3134],{"class":3114},[3108,6294,6296,6298,6300],{"class":3110,"line":6295},31,[3108,6297,5150],{"class":3114},[3108,6299,6024],{"class":3118},[3108,6301,3134],{"class":3114},[3108,6303,6305,6307,6309],{"class":3110,"line":6304},32,[3108,6306,3188],{"class":3114},[3108,6308,3341],{"class":3118},[3108,6310,3134],{"class":3114},[3108,6312,6314,6316,6318],{"class":3110,"line":6313},33,[3108,6315,3198],{"class":3114},[3108,6317,5999],{"class":3118},[3108,6319,3134],{"class":3114},[3108,6321,6323,6325,6327],{"class":3110,"line":6322},34,[3108,6324,3208],{"class":3114},[3108,6326,3119],{"class":3118},[3108,6328,3134],{"class":3114},[2964,6330,6331,6334],{},[2985,6332,6333],{},"Рядків коду",": ~25",[3041,6336,6338],{"id":6337},"avalonia-transitions-concise-implicit","Avalonia Transitions (concise, implicit)",[3099,6340,6341],{"className":3101,"code":3239,"language":3103,"meta":3104,"style":3104},[2968,6342,6343,6363,6371,6379,6405,6413,6421,6429,6443,6463,6471,6479],{"__ignoreMap":3104},[3108,6344,6345,6347,6349,6351,6353,6355,6357,6359,6361],{"class":3110,"line":3111},[3108,6346,3115],{"class":3114},[3108,6348,3119],{"class":3118},[3108,6350,3123],{"class":3122},[3108,6352,3127],{"class":3126},[3108,6354,3254],{"class":3130},[3108,6356,3257],{"class":3122},[3108,6358,3127],{"class":3126},[3108,6360,3262],{"class":3130},[3108,6362,3134],{"class":3114},[3108,6364,6365,6367,6369],{"class":3110,"line":3137},[3108,6366,3140],{"class":3114},[3108,6368,3143],{"class":3118},[3108,6370,3134],{"class":3114},[3108,6372,6373,6375,6377],{"class":3110,"line":3148},[3108,6374,3151],{"class":3114},[3108,6376,2987],{"class":3118},[3108,6378,3134],{"class":3114},[3108,6380,6381,6383,6385,6387,6389,6391,6393,6395,6397,6399,6401,6403],{"class":3110,"line":3158},[3108,6382,3161],{"class":3114},[3108,6384,3068],{"class":3118},[3108,6386,3166],{"class":3122},[3108,6388,3127],{"class":3126},[3108,6390,3171],{"class":3130},[3108,6392,3174],{"class":3122},[3108,6394,3127],{"class":3126},[3108,6396,3179],{"class":3130},[3108,6398,3301],{"class":3122},[3108,6400,3127],{"class":3126},[3108,6402,3306],{"class":3130},[3108,6404,3182],{"class":3114},[3108,6406,6407,6409,6411],{"class":3110,"line":3185},[3108,6408,3188],{"class":3114},[3108,6410,2987],{"class":3118},[3108,6412,3134],{"class":3114},[3108,6414,6415,6417,6419],{"class":3110,"line":3195},[3108,6416,3198],{"class":3114},[3108,6418,3143],{"class":3118},[3108,6420,3134],{"class":3114},[3108,6422,6423,6425,6427],{"class":3110,"line":3205},[3108,6424,3140],{"class":3114},[3108,6426,3331],{"class":3118},[3108,6428,3134],{"class":3114},[3108,6430,6431,6433,6435,6437,6439,6441],{"class":3110,"line":3336},[3108,6432,3151],{"class":3114},[3108,6434,3341],{"class":3118},[3108,6436,3344],{"class":3122},[3108,6438,3127],{"class":3126},[3108,6440,3349],{"class":3130},[3108,6442,3134],{"class":3114},[3108,6444,6445,6447,6449,6451,6453,6455,6457,6459,6461],{"class":3110,"line":3354},[3108,6446,3161],{"class":3114},[3108,6448,3359],{"class":3118},[3108,6450,3166],{"class":3122},[3108,6452,3127],{"class":3126},[3108,6454,3171],{"class":3130},[3108,6456,3368],{"class":3122},[3108,6458,3127],{"class":3126},[3108,6460,3373],{"class":3130},[3108,6462,3182],{"class":3114},[3108,6464,6465,6467,6469],{"class":3110,"line":3378},[3108,6466,3188],{"class":3114},[3108,6468,3341],{"class":3118},[3108,6470,3134],{"class":3114},[3108,6472,6473,6475,6477],{"class":3110,"line":3387},[3108,6474,3198],{"class":3114},[3108,6476,3331],{"class":3118},[3108,6478,3134],{"class":3114},[3108,6480,6481,6483,6485],{"class":3110,"line":3396},[3108,6482,3208],{"class":3114},[3108,6484,3119],{"class":3118},[3108,6486,3134],{"class":3114},[2964,6488,6489,6491],{},[2985,6490,6333],{},": ~10",[3041,6493,6495],{"id":6494},"порівняльна-таблиця","Порівняльна таблиця",[4082,6497,6498,6511],{},[4085,6499,6500],{},[4088,6501,6502,6505,6508],{},[4091,6503,6504],{},"Аспект",[4091,6506,6507],{},"WPF Storyboard",[4091,6509,6510],{},"Avalonia Transitions",[4101,6512,6513,6526,6539,6552,6570,6585],{},[4088,6514,6515,6520,6523],{},[4106,6516,6517],{},[2985,6518,6519],{},"Обсяг коду",[4106,6521,6522],{},"25+ рядків",[4106,6524,6525],{},"10 рядків",[4088,6527,6528,6533,6536],{},[4106,6529,6530],{},[2985,6531,6532],{},"Читабельність",[4106,6534,6535],{},"Складна вкладеність",[4106,6537,6538],{},"Плоска структура",[4088,6540,6541,6546,6549],{},[4106,6542,6543],{},[2985,6544,6545],{},"Двосторонність",[4106,6547,6548],{},"Потрібні 2 EventTrigger (Enter/Leave)",[4106,6550,6551],{},"Автоматично працює в обидва боки",[4088,6553,6554,6558,6564],{},[4106,6555,6556],{},[2985,6557,4055],{},[4106,6559,6560,6561],{},"Окремий елемент ",[2968,6562,6563],{},"\u003CEasingFunction>",[4106,6565,6566,6567],{},"Атрибут ",[2968,6568,6569],{},"Easing=\"...\"",[4088,6571,6572,6576,6582],{},[4106,6573,6574],{},[2985,6575,2978],{},[4106,6577,6578,6579,6581],{},"Рядок ",[2968,6580,3171],{}," з можливістю помилки",[4106,6583,6584],{},"Строго типізована властивість",[4088,6586,6587,6592,6597],{},[4106,6588,6589],{},[2985,6590,6591],{},"Запуск",[4106,6593,6594,6595],{},"Явний через ",[2968,6596,6049],{},[4106,6598,6599],{},"Неявний при зміні властивості",[6601,6602,6603,6646],"card-group",{},[6604,6605,6608],"card",{"icon":6606,"title":6607},"lucide:check-circle","Переваги Avalonia Transitions",[4044,6609,6610,6616,6628,6634,6640],{},[3413,6611,6612,6615],{},[2985,6613,6614],{},"Менше коду",": У 2-3 рази менше XAML для тієї ж анімації.",[3413,6617,6618,6621,6622,3229,6624,3229,6626,3007],{},[2985,6619,6620],{},"Простіше",": Не потрібно розуміти ",[2968,6623,3228],{},[2968,6625,6049],{},[2968,6627,2978],{},[3413,6629,6630,6633],{},[2985,6631,6632],{},"Декларативність",": Описуєте \"що\" анімувати, а не \"як\" це робити.",[3413,6635,6636,6639],{},[2985,6637,6638],{},"CSS-подібність",": Знайомий підхід для веб-розробників.",[3413,6641,6642,6645],{},[2985,6643,6644],{},"Автоматична двосторонність",": Не потрібно писати окремі анімації для \"вперед\" та \"назад\".",[6604,6647,6650],{"icon":6648,"title":6649},"lucide:alert-circle","Переваги WPF Storyboard",[4044,6651,6652,6661,6677],{},[3413,6653,6654,6657,6658,4276],{},[2985,6655,6656],{},"Більше контролю",": Можна анімувати вкладені властивості (наприклад, ",[2968,6659,6660],{},"(Button.RenderTransform).(ScaleTransform.ScaleX)",[3413,6662,6663,6666,6667,3229,6670,3229,6673,6676],{},[2985,6664,6665],{},"Складні сценарії",": ",[2968,6668,6669],{},"ParallelTimeline",[2968,6671,6672],{},"BeginTime",[2968,6674,6675],{},"RepeatBehavior=\"Forever\""," з точним контролем.",[3413,6678,6679,6682],{},[2985,6680,6681],{},"Зрілість",": Більше документації, прикладів, Stack Overflow відповідей.",[3034,6684],{},[2959,6686,6688],{"id":6687},"практичні-поради-та-best-practices","Практичні поради та Best Practices",[3041,6690,6692],{"id":6691},"_1-використовуйте-transitions-для-простих-анімацій","1. Використовуйте Transitions для простих анімацій",[2964,6694,6695,6696,6698],{},"Якщо вам потрібно анімувати зміну однієї властивості (прозорість, колір, розмір), завжди використовуйте ",[2968,6697,2987],{},". Це простіше, коротше та зрозуміліше.",[3099,6700,6702],{"className":3101,"code":6701,"language":3103,"meta":3104,"style":3104},"\u003C!-- ✅ Добре: Transition для простої анімації -->\n\u003CButton.Transitions>\n    \u003CTransitions>\n        \u003CDoubleTransition Property=\"Opacity\" Duration=\"0:0:0.3\"/>\n    \u003C/Transitions>\n\u003C/Button.Transitions>\n",[2968,6703,6704,6709,6717,6725,6745,6753],{"__ignoreMap":3104},[3108,6705,6706],{"class":3110,"line":3111},[3108,6707,6708],{"class":5735},"\u003C!-- ✅ Добре: Transition для простої анімації -->\n",[3108,6710,6711,6713,6715],{"class":3110,"line":3137},[3108,6712,3115],{"class":3114},[3108,6714,3143],{"class":3118},[3108,6716,3134],{"class":3114},[3108,6718,6719,6721,6723],{"class":3110,"line":3148},[3108,6720,3140],{"class":3114},[3108,6722,2987],{"class":3118},[3108,6724,3134],{"class":3114},[3108,6726,6727,6729,6731,6733,6735,6737,6739,6741,6743],{"class":3110,"line":3158},[3108,6728,3151],{"class":3114},[3108,6730,3068],{"class":3118},[3108,6732,3166],{"class":3122},[3108,6734,3127],{"class":3126},[3108,6736,3171],{"class":3130},[3108,6738,3174],{"class":3122},[3108,6740,3127],{"class":3126},[3108,6742,3179],{"class":3130},[3108,6744,3182],{"class":3114},[3108,6746,6747,6749,6751],{"class":3110,"line":3185},[3108,6748,3198],{"class":3114},[3108,6750,2987],{"class":3118},[3108,6752,3134],{"class":3114},[3108,6754,6755,6757,6759],{"class":3110,"line":3195},[3108,6756,3208],{"class":3114},[3108,6758,3143],{"class":3118},[3108,6760,3134],{"class":3114},[3041,6762,6764],{"id":6763},"_2-використовуйте-keyframe-для-складних-сценаріїв","2. Використовуйте KeyFrame для складних сценаріїв",[2964,6766,6767,6768,3007],{},"Якщо анімація має кілька етапів, змінює багато властивостей одночасно, або потребує програмного запуску — використовуйте ",[2968,6769,4675],{},[3099,6771,6773],{"className":3101,"code":6772,"language":3103,"meta":3104,"style":3104},"\u003C!-- ✅ Добре: KeyFrame для складної анімації -->\n\u003CStyle.Animations>\n    \u003CAnimation Duration=\"0:0:2\">\n        \u003CKeyFrame Cue=\"0%\">\n            \u003CSetter Property=\"Opacity\" Value=\"0\"/>\n            \u003CSetter Property=\"RenderTransform\" Value=\"translateY(-20px)\"/>\n        \u003C/KeyFrame>\n        \u003CKeyFrame Cue=\"100%\">\n            \u003CSetter Property=\"Opacity\" Value=\"1\"/>\n            \u003CSetter Property=\"RenderTransform\" Value=\"translateY(0)\"/>\n        \u003C/KeyFrame>\n    \u003C/Animation>\n\u003C/Style.Animations>\n",[2968,6774,6775,6780,6788,6802,6816,6837,6858,6866,6880,6901,6922,6930,6938],{"__ignoreMap":3104},[3108,6776,6777],{"class":3110,"line":3111},[3108,6778,6779],{"class":5735},"\u003C!-- ✅ Добре: KeyFrame для складної анімації -->\n",[3108,6781,6782,6784,6786],{"class":3110,"line":3137},[3108,6783,3115],{"class":3114},[3108,6785,5024],{"class":3118},[3108,6787,3134],{"class":3114},[3108,6789,6790,6792,6794,6796,6798,6800],{"class":3110,"line":3148},[3108,6791,3140],{"class":3114},[3108,6793,3027],{"class":3118},[3108,6795,3174],{"class":3122},[3108,6797,3127],{"class":3126},[3108,6799,4726],{"class":3130},[3108,6801,3134],{"class":3114},[3108,6803,6804,6806,6808,6810,6812,6814],{"class":3110,"line":3158},[3108,6805,3151],{"class":3114},[3108,6807,3031],{"class":3118},[3108,6809,4745],{"class":3122},[3108,6811,3127],{"class":3126},[3108,6813,4750],{"class":3130},[3108,6815,3134],{"class":3114},[3108,6817,6818,6820,6822,6824,6826,6828,6830,6832,6835],{"class":3110,"line":3185},[3108,6819,3161],{"class":3114},[3108,6821,3359],{"class":3118},[3108,6823,3166],{"class":3122},[3108,6825,3127],{"class":3126},[3108,6827,3171],{"class":3130},[3108,6829,3368],{"class":3122},[3108,6831,3127],{"class":3126},[3108,6833,6834],{"class":3130},"\"0\"",[3108,6836,3182],{"class":3114},[3108,6838,6839,6841,6843,6845,6847,6849,6851,6853,6856],{"class":3110,"line":3195},[3108,6840,3161],{"class":3114},[3108,6842,3359],{"class":3118},[3108,6844,3166],{"class":3122},[3108,6846,3127],{"class":3126},[3108,6848,3847],{"class":3130},[3108,6850,3368],{"class":3122},[3108,6852,3127],{"class":3126},[3108,6854,6855],{"class":3130},"\"translateY(-20px)\"",[3108,6857,3182],{"class":3114},[3108,6859,6860,6862,6864],{"class":3110,"line":3205},[3108,6861,3188],{"class":3114},[3108,6863,3031],{"class":3118},[3108,6865,3134],{"class":3114},[3108,6867,6868,6870,6872,6874,6876,6878],{"class":3110,"line":3336},[3108,6869,3151],{"class":3114},[3108,6871,3031],{"class":3118},[3108,6873,4745],{"class":3122},[3108,6875,3127],{"class":3126},[3108,6877,4837],{"class":3130},[3108,6879,3134],{"class":3114},[3108,6881,6882,6884,6886,6888,6890,6892,6894,6896,6899],{"class":3110,"line":3354},[3108,6883,3161],{"class":3114},[3108,6885,3359],{"class":3118},[3108,6887,3166],{"class":3122},[3108,6889,3127],{"class":3126},[3108,6891,3171],{"class":3130},[3108,6893,3368],{"class":3122},[3108,6895,3127],{"class":3126},[3108,6897,6898],{"class":3130},"\"1\"",[3108,6900,3182],{"class":3114},[3108,6902,6903,6905,6907,6909,6911,6913,6915,6917,6920],{"class":3110,"line":3378},[3108,6904,3161],{"class":3114},[3108,6906,3359],{"class":3118},[3108,6908,3166],{"class":3122},[3108,6910,3127],{"class":3126},[3108,6912,3847],{"class":3130},[3108,6914,3368],{"class":3122},[3108,6916,3127],{"class":3126},[3108,6918,6919],{"class":3130},"\"translateY(0)\"",[3108,6921,3182],{"class":3114},[3108,6923,6924,6926,6928],{"class":3110,"line":3387},[3108,6925,3188],{"class":3114},[3108,6927,3031],{"class":3118},[3108,6929,3134],{"class":3114},[3108,6931,6932,6934,6936],{"class":3110,"line":3396},[3108,6933,3198],{"class":3114},[3108,6935,3027],{"class":3118},[3108,6937,3134],{"class":3114},[3108,6939,6940,6942,6944],{"class":3110,"line":3756},[3108,6941,3208],{"class":3114},[3108,6943,5024],{"class":3118},[3108,6945,3134],{"class":3114},[3041,6947,6949],{"id":6948},"_3-не-змішуйте-transitions-та-keyframe-для-однієї-властивості","3. Не змішуйте Transitions та KeyFrame для однієї властивості",[2964,6951,6952,6953,6955,6956,6958,6959,6962,6963,6965],{},"Якщо ви визначили ",[2968,6954,3068],{}," для ",[2968,6957,3056],{},", і одночасно маєте ",[2968,6960,6961],{},"KeyFrame Animation",", яка також змінює ",[2968,6964,3056],{},", результат може бути непередбачуваним. Avalonia спробує застосувати обидві анімації, що призведе до конфліктів.",[3099,6967,6969],{"className":3101,"code":6968,"language":3103,"meta":3104,"style":3104},"\u003C!-- ❌ Погано: Конфлікт між Transition та KeyFrame -->\n\u003CButton.Transitions>\n    \u003CTransitions>\n        \u003CDoubleTransition Property=\"Opacity\" Duration=\"0:0:0.5\"/>\n    \u003C/Transitions>\n\u003C/Button.Transitions>\n\u003CButton.Styles>\n    \u003CStyle Selector=\"Button\">\n        \u003CStyle.Animations>\n            \u003CAnimation Duration=\"0:0:1\">\n                \u003CKeyFrame Cue=\"0%\">\n                    \u003CSetter Property=\"Opacity\" Value=\"0\"/>\n                \u003C/KeyFrame>\n                \u003CKeyFrame Cue=\"100%\">\n                    \u003CSetter Property=\"Opacity\" Value=\"1\"/>\n                \u003C/KeyFrame>\n            \u003C/Animation>\n        \u003C/Style.Animations>\n    \u003C/Style>\n\u003C/Button.Styles>\n",[2968,6970,6971,6976,6984,6992,7012,7020,7028,7036,7050,7058,7073,7087,7107,7115,7129,7149,7157,7165,7173,7181],{"__ignoreMap":3104},[3108,6972,6973],{"class":3110,"line":3111},[3108,6974,6975],{"class":5735},"\u003C!-- ❌ Погано: Конфлікт між Transition та KeyFrame -->\n",[3108,6977,6978,6980,6982],{"class":3110,"line":3137},[3108,6979,3115],{"class":3114},[3108,6981,3143],{"class":3118},[3108,6983,3134],{"class":3114},[3108,6985,6986,6988,6990],{"class":3110,"line":3148},[3108,6987,3140],{"class":3114},[3108,6989,2987],{"class":3118},[3108,6991,3134],{"class":3114},[3108,6993,6994,6996,6998,7000,7002,7004,7006,7008,7010],{"class":3110,"line":3158},[3108,6995,3151],{"class":3114},[3108,6997,3068],{"class":3118},[3108,6999,3166],{"class":3122},[3108,7001,3127],{"class":3126},[3108,7003,3171],{"class":3130},[3108,7005,3174],{"class":3122},[3108,7007,3127],{"class":3126},[3108,7009,3528],{"class":3130},[3108,7011,3182],{"class":3114},[3108,7013,7014,7016,7018],{"class":3110,"line":3185},[3108,7015,3198],{"class":3114},[3108,7017,2987],{"class":3118},[3108,7019,3134],{"class":3114},[3108,7021,7022,7024,7026],{"class":3110,"line":3195},[3108,7023,3208],{"class":3114},[3108,7025,3143],{"class":3118},[3108,7027,3134],{"class":3114},[3108,7029,7030,7032,7034],{"class":3110,"line":3205},[3108,7031,3115],{"class":3114},[3108,7033,3331],{"class":3118},[3108,7035,3134],{"class":3114},[3108,7037,7038,7040,7042,7044,7046,7048],{"class":3110,"line":3336},[3108,7039,3140],{"class":3114},[3108,7041,3341],{"class":3118},[3108,7043,3344],{"class":3122},[3108,7045,3127],{"class":3126},[3108,7047,6015],{"class":3130},[3108,7049,3134],{"class":3114},[3108,7051,7052,7054,7056],{"class":3110,"line":3354},[3108,7053,3151],{"class":3114},[3108,7055,5024],{"class":3118},[3108,7057,3134],{"class":3114},[3108,7059,7060,7062,7064,7066,7068,7071],{"class":3110,"line":3378},[3108,7061,3161],{"class":3114},[3108,7063,3027],{"class":3118},[3108,7065,3174],{"class":3122},[3108,7067,3127],{"class":3126},[3108,7069,7070],{"class":3130},"\"0:0:1\"",[3108,7072,3134],{"class":3114},[3108,7074,7075,7077,7079,7081,7083,7085],{"class":3110,"line":3387},[3108,7076,5031],{"class":3114},[3108,7078,3031],{"class":3118},[3108,7080,4745],{"class":3122},[3108,7082,3127],{"class":3126},[3108,7084,4750],{"class":3130},[3108,7086,3134],{"class":3114},[3108,7088,7089,7091,7093,7095,7097,7099,7101,7103,7105],{"class":3110,"line":3396},[3108,7090,5052],{"class":3114},[3108,7092,3359],{"class":3118},[3108,7094,3166],{"class":3122},[3108,7096,3127],{"class":3126},[3108,7098,3171],{"class":3130},[3108,7100,3368],{"class":3122},[3108,7102,3127],{"class":3126},[3108,7104,6834],{"class":3130},[3108,7106,3182],{"class":3114},[3108,7108,7109,7111,7113],{"class":3110,"line":3756},[3108,7110,5141],{"class":3114},[3108,7112,3031],{"class":3118},[3108,7114,3134],{"class":3114},[3108,7116,7117,7119,7121,7123,7125,7127],{"class":3110,"line":4513},[3108,7118,5031],{"class":3114},[3108,7120,3031],{"class":3118},[3108,7122,4745],{"class":3122},[3108,7124,3127],{"class":3126},[3108,7126,4837],{"class":3130},[3108,7128,3134],{"class":3114},[3108,7130,7131,7133,7135,7137,7139,7141,7143,7145,7147],{"class":3110,"line":4535},[3108,7132,5052],{"class":3114},[3108,7134,3359],{"class":3118},[3108,7136,3166],{"class":3122},[3108,7138,3127],{"class":3126},[3108,7140,3171],{"class":3130},[3108,7142,3368],{"class":3122},[3108,7144,3127],{"class":3126},[3108,7146,6898],{"class":3130},[3108,7148,3182],{"class":3114},[3108,7150,7151,7153,7155],{"class":3110,"line":4557},[3108,7152,5141],{"class":3114},[3108,7154,3031],{"class":3118},[3108,7156,3134],{"class":3114},[3108,7158,7159,7161,7163],{"class":3110,"line":4566},[3108,7160,5150],{"class":3114},[3108,7162,3027],{"class":3118},[3108,7164,3134],{"class":3114},[3108,7166,7167,7169,7171],{"class":3110,"line":4575},[3108,7168,3188],{"class":3114},[3108,7170,5024],{"class":3118},[3108,7172,3134],{"class":3114},[3108,7174,7175,7177,7179],{"class":3110,"line":5563},[3108,7176,3198],{"class":3114},[3108,7178,3341],{"class":3118},[3108,7180,3134],{"class":3114},[3108,7182,7183,7185,7187],{"class":3110,"line":5584},[3108,7184,3208],{"class":3114},[3108,7186,3331],{"class":3118},[3108,7188,3134],{"class":3114},[2964,7190,7191,7194,7195,7197,7198,7200],{},[2985,7192,7193],{},"Рішення",": Використовуйте або ",[2968,7196,3049],{},", або ",[2968,7199,6961],{}," для однієї властивості, але не обидва одночасно.",[3041,7202,7204],{"id":7203},"_4-оптимізуйте-тривалість-анімацій","4. Оптимізуйте тривалість анімацій",[2964,7206,7207,7208,3007],{},"Занадто швидкі анімації (\u003C 100 мс) можуть бути непомітними. Занадто повільні (> 500 мс) можуть дратувати користувача. Оптимальний діапазон для більшості UI-анімацій — ",[2985,7209,7210],{},"200-400 мс",[4082,7212,7213,7223],{},[4085,7214,7215],{},[4088,7216,7217,7220],{},[4091,7218,7219],{},"Тип анімації",[4091,7221,7222],{},"Рекомендована тривалість",[4101,7224,7225,7233,7241,7249],{},[4088,7226,7227,7230],{},[4106,7228,7229],{},"Hover-ефекти",[4106,7231,7232],{},"200-300 мс",[4088,7234,7235,7238],{},[4106,7236,7237],{},"Модальні вікна (поява/зникнення)",[4106,7239,7240],{},"300-400 мс",[4088,7242,7243,7246],{},[4106,7244,7245],{},"Переходи між сторінками",[4106,7247,7248],{},"400-500 мс",[4088,7250,7251,7254],{},[4106,7252,7253],{},"Мікроанімації (іконки, індикатори)",[4106,7255,7256],{},"150-250 мс",[3041,7258,7260],{"id":7259},"_5-використовуйте-rendertransformorigin-для-обертання-та-масштабування","5. Використовуйте RenderTransformOrigin для обертання та масштабування",[2964,7262,7263,7264,7266,7267,7269],{},"Якщо ви анімуєте ",[2968,7265,3828],{}," (обертання, масштабування), завжди встановлюйте ",[2968,7268,5233],{},", щоб контролювати точку трансформації.",[3099,7271,7273],{"className":3101,"code":7272,"language":3103,"meta":3104,"style":3104},"\u003C!-- ✅ Добре: Обертання навколо центру -->\n\u003CButton RenderTransformOrigin=\"0.5, 0.5\">\n    \u003CButton.Styles>\n        \u003CStyle Selector=\"Button:pointerover\">\n            \u003CSetter Property=\"RenderTransform\" Value=\"rotate(5deg)\"/>\n        \u003C/Style>\n    \u003C/Button.Styles>\n\u003C/Button>\n",[2968,7274,7275,7280,7294,7302,7316,7337,7345,7353],{"__ignoreMap":3104},[3108,7276,7277],{"class":3110,"line":3111},[3108,7278,7279],{"class":5735},"\u003C!-- ✅ Добре: Обертання навколо центру -->\n",[3108,7281,7282,7284,7286,7288,7290,7292],{"class":3110,"line":3137},[3108,7283,3115],{"class":3114},[3108,7285,3119],{"class":3118},[3108,7287,3886],{"class":3122},[3108,7289,3127],{"class":3126},[3108,7291,3891],{"class":3130},[3108,7293,3134],{"class":3114},[3108,7295,7296,7298,7300],{"class":3110,"line":3148},[3108,7297,3140],{"class":3114},[3108,7299,3331],{"class":3118},[3108,7301,3134],{"class":3114},[3108,7303,7304,7306,7308,7310,7312,7314],{"class":3110,"line":3158},[3108,7305,3151],{"class":3114},[3108,7307,3341],{"class":3118},[3108,7309,3344],{"class":3122},[3108,7311,3127],{"class":3126},[3108,7313,3349],{"class":3130},[3108,7315,3134],{"class":3114},[3108,7317,7318,7320,7322,7324,7326,7328,7330,7332,7335],{"class":3110,"line":3185},[3108,7319,3161],{"class":3114},[3108,7321,3359],{"class":3118},[3108,7323,3166],{"class":3122},[3108,7325,3127],{"class":3126},[3108,7327,3847],{"class":3130},[3108,7329,3368],{"class":3122},[3108,7331,3127],{"class":3126},[3108,7333,7334],{"class":3130},"\"rotate(5deg)\"",[3108,7336,3182],{"class":3114},[3108,7338,7339,7341,7343],{"class":3110,"line":3195},[3108,7340,3188],{"class":3114},[3108,7342,3341],{"class":3118},[3108,7344,3134],{"class":3114},[3108,7346,7347,7349,7351],{"class":3110,"line":3205},[3108,7348,3198],{"class":3114},[3108,7350,3331],{"class":3118},[3108,7352,3134],{"class":3114},[3108,7354,7355,7357,7359],{"class":3110,"line":3336},[3108,7356,3208],{"class":3114},[3108,7358,3119],{"class":3118},[3108,7360,3134],{"class":3114},[2964,7362,7363,7364,7366],{},"Без ",[2968,7365,5233],{}," обертання відбуватиметься навколо лівого верхнього кута (0, 0), що виглядає неприродно.",[7368,7369,7371,7374,7375,7377,7378,7381,7382,7384,7385,7387],"warning",{"icon":7370},"lucide:alert-triangle",[2985,7372,7373],{},"Увага",": На відміну від WPF, де ",[2968,7376,5233],{}," за замовчуванням ",[2968,7379,7380],{},"0, 0",", в Avalonia це також ",[2968,7383,7380],{},". Завжди явно встановлюйте ",[2968,7386,5237],{}," для центрованих трансформацій.",[3034,7389],{},[2959,7391,7393],{"id":7392},"реальний-приклад-портування-wpf-анімації-на-avalonia","Реальний приклад: Портування WPF анімації на Avalonia",[2964,7395,7396],{},"Давайте візьмемо складну анімацію з WPF (з попередньої статті про WPF анімації) та портуємо її на Avalonia, щоб побачити різницю в обсязі коду.",[3041,7398,7400],{"id":7399},"сценарій-анімація-бічної-панелі-sidebar","Сценарій: Анімація бічної панелі (Sidebar)",[2964,7402,7403,7404,7407,7408,3007],{},"У WPF ми створювали анімацію, яка висуває бічну панель з лівого краю екрану. Панель спочатку має ",[2968,7405,7406],{},"Width=\"0\"",", а при натисканні кнопки розширюється до ",[2968,7409,7410],{},"Width=\"250\"",[3041,7412,7414],{"id":7413},"wpf-версія-storyboard","WPF версія (Storyboard)",[3099,7416,7418],{"className":3101,"code":7417,"language":3103,"meta":3104,"style":3104},"\u003C!-- WPF: ~30 рядків коду -->\n\u003CGrid>\n    \u003CGrid.ColumnDefinitions>\n        \u003CColumnDefinition Width=\"Auto\"/>\n        \u003CColumnDefinition Width=\"*\"/>\n    \u003C/Grid.ColumnDefinitions>\n    \n    \u003CBorder x:Name=\"Sidebar\" Grid.Column=\"0\" Width=\"0\" Background=\"LightGray\">\n        \u003CStackPanel Margin=\"10\">\n            \u003CTextBlock Text=\"Меню\" FontWeight=\"Bold\"/>\n            \u003CButton Content=\"Пункт 1\" Margin=\"0,5\"/>\n            \u003CButton Content=\"Пункт 2\" Margin=\"0,5\"/>\n        \u003C/StackPanel>\n    \u003C/Border>\n    \n    \u003CButton Grid.Column=\"1\" Content=\"Показати меню\" Click=\"ToggleSidebar_Click\"/>\n\u003C/Grid>\n\n\u003C!-- Code-Behind -->\n\u003CWindow.Resources>\n    \u003CStoryboard x:Key=\"ShowSidebar\">\n        \u003CDoubleAnimation Storyboard.TargetName=\"Sidebar\"\n                       Storyboard.TargetProperty=\"Width\"\n                       To=\"250\"\n                       Duration=\"0:0:0.4\">\n            \u003CDoubleAnimation.EasingFunction>\n                \u003CCubicEase EasingMode=\"EaseOut\"/>\n            \u003C/DoubleAnimation.EasingFunction>\n        \u003C/DoubleAnimation>\n    \u003C/Storyboard>\n    \u003CStoryboard x:Key=\"HideSidebar\">\n        \u003CDoubleAnimation Storyboard.TargetName=\"Sidebar\"\n                       Storyboard.TargetProperty=\"Width\"\n                       To=\"0\"\n                       Duration=\"0:0:0.4\">\n            \u003CDoubleAnimation.EasingFunction>\n                \u003CCubicEase EasingMode=\"EaseOut\"/>\n            \u003C/DoubleAnimation.EasingFunction>\n        \u003C/DoubleAnimation>\n    \u003C/Storyboard>\n\u003C/Window.Resources>\n",[2968,7419,7420,7425,7434,7443,7459,7474,7482,7487,7523,7540,7563,7585,7606,7614,7622,7626,7655,7663,7667,7672,7681,7697,7711,7721,7731,7742,7750,7765,7773,7781,7789,7804,7816,7824,7833,7844,7853,7868,7877,7886,7895],{"__ignoreMap":3104},[3108,7421,7422],{"class":3110,"line":3111},[3108,7423,7424],{"class":5735},"\u003C!-- WPF: ~30 рядків коду -->\n",[3108,7426,7427,7429,7432],{"class":3110,"line":3137},[3108,7428,3115],{"class":3114},[3108,7430,7431],{"class":3118},"Grid",[3108,7433,3134],{"class":3114},[3108,7435,7436,7438,7441],{"class":3110,"line":3148},[3108,7437,3140],{"class":3114},[3108,7439,7440],{"class":3118},"Grid.ColumnDefinitions",[3108,7442,3134],{"class":3114},[3108,7444,7445,7447,7450,7452,7454,7457],{"class":3110,"line":3158},[3108,7446,3151],{"class":3114},[3108,7448,7449],{"class":3118},"ColumnDefinition",[3108,7451,4957],{"class":3122},[3108,7453,3127],{"class":3126},[3108,7455,7456],{"class":3130},"\"Auto\"",[3108,7458,3182],{"class":3114},[3108,7460,7461,7463,7465,7467,7469,7472],{"class":3110,"line":3185},[3108,7462,3151],{"class":3114},[3108,7464,7449],{"class":3118},[3108,7466,4957],{"class":3122},[3108,7468,3127],{"class":3126},[3108,7470,7471],{"class":3130},"\"*\"",[3108,7473,3182],{"class":3114},[3108,7475,7476,7478,7480],{"class":3110,"line":3195},[3108,7477,3198],{"class":3114},[3108,7479,7440],{"class":3118},[3108,7481,3134],{"class":3114},[3108,7483,7484],{"class":3110,"line":3205},[3108,7485,7486],{"class":3126},"    \n",[3108,7488,7489,7491,7493,7496,7498,7501,7504,7506,7508,7510,7512,7514,7516,7518,7521],{"class":3110,"line":3336},[3108,7490,3140],{"class":3114},[3108,7492,3597],{"class":3118},[3108,7494,7495],{"class":3122}," x:Name",[3108,7497,3127],{"class":3126},[3108,7499,7500],{"class":3130},"\"Sidebar\"",[3108,7502,7503],{"class":3122}," Grid.Column",[3108,7505,3127],{"class":3126},[3108,7507,6834],{"class":3130},[3108,7509,4957],{"class":3122},[3108,7511,3127],{"class":3126},[3108,7513,6834],{"class":3130},[3108,7515,3600],{"class":3122},[3108,7517,3127],{"class":3126},[3108,7519,7520],{"class":3130},"\"LightGray\"",[3108,7522,3134],{"class":3114},[3108,7524,7525,7527,7530,7533,7535,7538],{"class":3110,"line":3354},[3108,7526,3151],{"class":3114},[3108,7528,7529],{"class":3118},"StackPanel",[3108,7531,7532],{"class":3122}," Margin",[3108,7534,3127],{"class":3126},[3108,7536,7537],{"class":3130},"\"10\"",[3108,7539,3134],{"class":3114},[3108,7541,7542,7544,7546,7548,7550,7553,7556,7558,7561],{"class":3110,"line":3378},[3108,7543,3161],{"class":3114},[3108,7545,3744],{"class":3118},[3108,7547,3747],{"class":3122},[3108,7549,3127],{"class":3126},[3108,7551,7552],{"class":3130},"\"Меню\"",[3108,7554,7555],{"class":3122}," FontWeight",[3108,7557,3127],{"class":3126},[3108,7559,7560],{"class":3130},"\"Bold\"",[3108,7562,3182],{"class":3114},[3108,7564,7565,7567,7569,7571,7573,7576,7578,7580,7583],{"class":3110,"line":3387},[3108,7566,3161],{"class":3114},[3108,7568,3119],{"class":3118},[3108,7570,3123],{"class":3122},[3108,7572,3127],{"class":3126},[3108,7574,7575],{"class":3130},"\"Пункт 1\"",[3108,7577,7532],{"class":3122},[3108,7579,3127],{"class":3126},[3108,7581,7582],{"class":3130},"\"0,5\"",[3108,7584,3182],{"class":3114},[3108,7586,7587,7589,7591,7593,7595,7598,7600,7602,7604],{"class":3110,"line":3396},[3108,7588,3161],{"class":3114},[3108,7590,3119],{"class":3118},[3108,7592,3123],{"class":3122},[3108,7594,3127],{"class":3126},[3108,7596,7597],{"class":3130},"\"Пункт 2\"",[3108,7599,7532],{"class":3122},[3108,7601,3127],{"class":3126},[3108,7603,7582],{"class":3130},[3108,7605,3182],{"class":3114},[3108,7607,7608,7610,7612],{"class":3110,"line":3756},[3108,7609,3188],{"class":3114},[3108,7611,7529],{"class":3118},[3108,7613,3134],{"class":3114},[3108,7615,7616,7618,7620],{"class":3110,"line":4513},[3108,7617,3198],{"class":3114},[3108,7619,3597],{"class":3118},[3108,7621,3134],{"class":3114},[3108,7623,7624],{"class":3110,"line":4535},[3108,7625,7486],{"class":3126},[3108,7627,7628,7630,7632,7634,7636,7638,7640,7642,7645,7648,7650,7653],{"class":3110,"line":4557},[3108,7629,3140],{"class":3114},[3108,7631,3119],{"class":3118},[3108,7633,7503],{"class":3122},[3108,7635,3127],{"class":3126},[3108,7637,6898],{"class":3130},[3108,7639,3123],{"class":3122},[3108,7641,3127],{"class":3126},[3108,7643,7644],{"class":3130},"\"Показати меню\"",[3108,7646,7647],{"class":3122}," Click",[3108,7649,3127],{"class":3126},[3108,7651,7652],{"class":3130},"\"ToggleSidebar_Click\"",[3108,7654,3182],{"class":3114},[3108,7656,7657,7659,7661],{"class":3110,"line":4566},[3108,7658,3208],{"class":3114},[3108,7660,7431],{"class":3118},[3108,7662,3134],{"class":3114},[3108,7664,7665],{"class":3110,"line":4575},[3108,7666,5929],{"emptyLinePlaceholder":5928},[3108,7668,7669],{"class":3110,"line":5563},[3108,7670,7671],{"class":5735},"\u003C!-- Code-Behind -->\n",[3108,7673,7674,7676,7679],{"class":3110,"line":5584},[3108,7675,3115],{"class":3114},[3108,7677,7678],{"class":3118},"Window.Resources",[3108,7680,3134],{"class":3114},[3108,7682,7683,7685,7687,7690,7692,7695],{"class":3110,"line":5605},[3108,7684,3140],{"class":3114},[3108,7686,2970],{"class":3118},[3108,7688,7689],{"class":3122}," x:Key",[3108,7691,3127],{"class":3126},[3108,7693,7694],{"class":3130},"\"ShowSidebar\"",[3108,7696,3134],{"class":3114},[3108,7698,7699,7701,7703,7706,7708],{"class":3110,"line":5614},[3108,7700,3151],{"class":3114},[3108,7702,2974],{"class":3118},[3108,7704,7705],{"class":3122}," Storyboard.TargetName",[3108,7707,3127],{"class":3126},[3108,7709,7710],{"class":3130},"\"Sidebar\"\n",[3108,7712,7713,7716,7718],{"class":3110,"line":5623},[3108,7714,7715],{"class":3122},"                       Storyboard.TargetProperty",[3108,7717,3127],{"class":3126},[3108,7719,7720],{"class":3130},"\"Width\"\n",[3108,7722,7723,7726,7728],{"class":3110,"line":5632},[3108,7724,7725],{"class":3122},"                       To",[3108,7727,3127],{"class":3126},[3108,7729,7730],{"class":3130},"\"250\"\n",[3108,7732,7733,7736,7738,7740],{"class":3110,"line":5641},[3108,7734,7735],{"class":3122},"                       Duration",[3108,7737,3127],{"class":3126},[3108,7739,3580],{"class":3130},[3108,7741,3134],{"class":3114},[3108,7743,7744,7746,7748],{"class":3110,"line":5650},[3108,7745,3161],{"class":3114},[3108,7747,6103],{"class":3118},[3108,7749,3134],{"class":3114},[3108,7751,7752,7754,7756,7758,7760,7763],{"class":3110,"line":5685},[3108,7753,5031],{"class":3114},[3108,7755,4163],{"class":3118},[3108,7757,6115],{"class":3122},[3108,7759,3127],{"class":3126},[3108,7761,7762],{"class":3130},"\"EaseOut\"",[3108,7764,3182],{"class":3114},[3108,7766,7767,7769,7771],{"class":3110,"line":6268},[3108,7768,5150],{"class":3114},[3108,7770,6103],{"class":3118},[3108,7772,3134],{"class":3114},[3108,7774,7775,7777,7779],{"class":3110,"line":6277},[3108,7776,3188],{"class":3114},[3108,7778,2974],{"class":3118},[3108,7780,3134],{"class":3114},[3108,7782,7783,7785,7787],{"class":3110,"line":6286},[3108,7784,3198],{"class":3114},[3108,7786,2970],{"class":3118},[3108,7788,3134],{"class":3114},[3108,7790,7791,7793,7795,7797,7799,7802],{"class":3110,"line":6295},[3108,7792,3140],{"class":3114},[3108,7794,2970],{"class":3118},[3108,7796,7689],{"class":3122},[3108,7798,3127],{"class":3126},[3108,7800,7801],{"class":3130},"\"HideSidebar\"",[3108,7803,3134],{"class":3114},[3108,7805,7806,7808,7810,7812,7814],{"class":3110,"line":6304},[3108,7807,3151],{"class":3114},[3108,7809,2974],{"class":3118},[3108,7811,7705],{"class":3122},[3108,7813,3127],{"class":3126},[3108,7815,7710],{"class":3130},[3108,7817,7818,7820,7822],{"class":3110,"line":6313},[3108,7819,7715],{"class":3122},[3108,7821,3127],{"class":3126},[3108,7823,7720],{"class":3130},[3108,7825,7826,7828,7830],{"class":3110,"line":6322},[3108,7827,7725],{"class":3122},[3108,7829,3127],{"class":3126},[3108,7831,7832],{"class":3130},"\"0\"\n",[3108,7834,7836,7838,7840,7842],{"class":3110,"line":7835},35,[3108,7837,7735],{"class":3122},[3108,7839,3127],{"class":3126},[3108,7841,3580],{"class":3130},[3108,7843,3134],{"class":3114},[3108,7845,7847,7849,7851],{"class":3110,"line":7846},36,[3108,7848,3161],{"class":3114},[3108,7850,6103],{"class":3118},[3108,7852,3134],{"class":3114},[3108,7854,7856,7858,7860,7862,7864,7866],{"class":3110,"line":7855},37,[3108,7857,5031],{"class":3114},[3108,7859,4163],{"class":3118},[3108,7861,6115],{"class":3122},[3108,7863,3127],{"class":3126},[3108,7865,7762],{"class":3130},[3108,7867,3182],{"class":3114},[3108,7869,7871,7873,7875],{"class":3110,"line":7870},38,[3108,7872,5150],{"class":3114},[3108,7874,6103],{"class":3118},[3108,7876,3134],{"class":3114},[3108,7878,7880,7882,7884],{"class":3110,"line":7879},39,[3108,7881,3188],{"class":3114},[3108,7883,2974],{"class":3118},[3108,7885,3134],{"class":3114},[3108,7887,7889,7891,7893],{"class":3110,"line":7888},40,[3108,7890,3198],{"class":3114},[3108,7892,2970],{"class":3118},[3108,7894,3134],{"class":3114},[3108,7896,7898,7900,7902],{"class":3110,"line":7897},41,[3108,7899,3208],{"class":3114},[3108,7901,7678],{"class":3118},[3108,7903,3134],{"class":3114},[3099,7905,7907],{"className":5726,"code":7906,"language":5728,"meta":3104,"style":3104},"// Code-Behind: ~10 рядків\nprivate bool isSidebarVisible = false;\n\nprivate void ToggleSidebar_Click(object sender, RoutedEventArgs e)\n{\n    var storyboard = isSidebarVisible \n        ? (Storyboard)FindResource(\"HideSidebar\") \n        : (Storyboard)FindResource(\"ShowSidebar\");\n    \n    storyboard.Begin();\n    isSidebarVisible = !isSidebarVisible;\n}\n",[2968,7908,7909,7914,7933,7937,7966,7970,7986,8007,8024,8028,8041,8053],{"__ignoreMap":3104},[3108,7910,7911],{"class":3110,"line":3111},[3108,7912,7913],{"class":5735},"// Code-Behind: ~10 рядків\n",[3108,7915,7916,7919,7922,7925,7927,7930],{"class":3110,"line":3137},[3108,7917,7918],{"class":5741},"private",[3108,7920,7921],{"class":5741}," bool",[3108,7923,7924],{"class":5745}," isSidebarVisible",[3108,7926,5749],{"class":3126},[3108,7928,7929],{"class":5741},"false",[3108,7931,7932],{"class":3126},";\n",[3108,7934,7935],{"class":3110,"line":3148},[3108,7936,5929],{"emptyLinePlaceholder":5928},[3108,7938,7939,7941,7944,7947,7949,7952,7955,7957,7960,7963],{"class":3110,"line":3158},[3108,7940,7918],{"class":5741},[3108,7942,7943],{"class":5741}," void",[3108,7945,7946],{"class":5776}," ToggleSidebar_Click",[3108,7948,5780],{"class":3126},[3108,7950,7951],{"class":5741},"object",[3108,7953,7954],{"class":5745}," sender",[3108,7956,3229],{"class":3126},[3108,7958,7959],{"class":5755},"RoutedEventArgs",[3108,7961,7962],{"class":5745}," e",[3108,7964,7965],{"class":3126},")\n",[3108,7967,7968],{"class":3110,"line":3185},[3108,7969,5761],{"class":3126},[3108,7971,7972,7975,7978,7980,7983],{"class":3110,"line":3195},[3108,7973,7974],{"class":5741},"    var",[3108,7976,7977],{"class":5745}," storyboard",[3108,7979,5749],{"class":3126},[3108,7981,7982],{"class":5745},"isSidebarVisible",[3108,7984,7985],{"class":3126}," \n",[3108,7987,7988,7991,7993,7996,7999,8001,8004],{"class":3110,"line":3205},[3108,7989,7990],{"class":3126},"        ? (",[3108,7992,2970],{"class":5755},[3108,7994,7995],{"class":3126},")",[3108,7997,7998],{"class":5776},"FindResource",[3108,8000,5780],{"class":3126},[3108,8002,7801],{"class":8003},"sbdoH",[3108,8005,8006],{"class":3126},") \n",[3108,8008,8009,8012,8014,8016,8018,8020,8022],{"class":3110,"line":3336},[3108,8010,8011],{"class":3126},"        : (",[3108,8013,2970],{"class":5755},[3108,8015,7995],{"class":3126},[3108,8017,7998],{"class":5776},[3108,8019,5780],{"class":3126},[3108,8021,7694],{"class":8003},[3108,8023,5949],{"class":3126},[3108,8025,8026],{"class":3110,"line":3354},[3108,8027,7486],{"class":3126},[3108,8029,8030,8033,8035,8038],{"class":3110,"line":3378},[3108,8031,8032],{"class":5745},"    storyboard",[3108,8034,3007],{"class":3126},[3108,8036,8037],{"class":5776},"Begin",[3108,8039,8040],{"class":3126},"();\n",[3108,8042,8043,8046,8049,8051],{"class":3110,"line":3387},[3108,8044,8045],{"class":5745},"    isSidebarVisible",[3108,8047,8048],{"class":3126}," = !",[3108,8050,7982],{"class":5745},[3108,8052,7932],{"class":3126},[3108,8054,8055],{"class":3110,"line":3396},[3108,8056,8057],{"class":3126},"}\n",[2964,8059,8060,8063],{},[2985,8061,8062],{},"Загалом",": ~40 рядків XAML + Code-Behind.",[3041,8065,8067],{"id":8066},"avalonia-версія-transitions","Avalonia версія (Transitions)",[3099,8069,8071],{"className":3101,"code":8070,"language":3103,"meta":3104,"style":3104},"\u003C!-- Avalonia: ~15 рядків коду -->\n\u003CGrid>\n    \u003CGrid.ColumnDefinitions>\n        \u003CColumnDefinition Width=\"Auto\"/>\n        \u003CColumnDefinition Width=\"*\"/>\n    \u003C/Grid.ColumnDefinitions>\n    \n    \u003CBorder x:Name=\"Sidebar\" Grid.Column=\"0\" Width=\"0\" Background=\"LightGray\">\n        \u003CBorder.Transitions>\n            \u003CTransitions>\n                \u003CDoubleTransition Property=\"Width\" Duration=\"0:0:0.4\" Easing=\"CubicEaseOut\"/>\n            \u003C/Transitions>\n        \u003C/Border.Transitions>\n        \u003CStackPanel Margin=\"10\">\n            \u003CTextBlock Text=\"Меню\" FontWeight=\"Bold\"/>\n            \u003CButton Content=\"Пункт 1\" Margin=\"0,5\"/>\n            \u003CButton Content=\"Пункт 2\" Margin=\"0,5\"/>\n        \u003C/StackPanel>\n    \u003C/Border>\n    \n    \u003CButton Grid.Column=\"1\" Content=\"Показати меню\" Click=\"ToggleSidebar_Click\"/>\n\u003C/Grid>\n",[2968,8072,8073,8078,8086,8094,8108,8122,8130,8134,8166,8174,8182,8210,8218,8226,8240,8260,8280,8300,8308,8316,8320,8346],{"__ignoreMap":3104},[3108,8074,8075],{"class":3110,"line":3111},[3108,8076,8077],{"class":5735},"\u003C!-- Avalonia: ~15 рядків коду -->\n",[3108,8079,8080,8082,8084],{"class":3110,"line":3137},[3108,8081,3115],{"class":3114},[3108,8083,7431],{"class":3118},[3108,8085,3134],{"class":3114},[3108,8087,8088,8090,8092],{"class":3110,"line":3148},[3108,8089,3140],{"class":3114},[3108,8091,7440],{"class":3118},[3108,8093,3134],{"class":3114},[3108,8095,8096,8098,8100,8102,8104,8106],{"class":3110,"line":3158},[3108,8097,3151],{"class":3114},[3108,8099,7449],{"class":3118},[3108,8101,4957],{"class":3122},[3108,8103,3127],{"class":3126},[3108,8105,7456],{"class":3130},[3108,8107,3182],{"class":3114},[3108,8109,8110,8112,8114,8116,8118,8120],{"class":3110,"line":3185},[3108,8111,3151],{"class":3114},[3108,8113,7449],{"class":3118},[3108,8115,4957],{"class":3122},[3108,8117,3127],{"class":3126},[3108,8119,7471],{"class":3130},[3108,8121,3182],{"class":3114},[3108,8123,8124,8126,8128],{"class":3110,"line":3195},[3108,8125,3198],{"class":3114},[3108,8127,7440],{"class":3118},[3108,8129,3134],{"class":3114},[3108,8131,8132],{"class":3110,"line":3205},[3108,8133,7486],{"class":3126},[3108,8135,8136,8138,8140,8142,8144,8146,8148,8150,8152,8154,8156,8158,8160,8162,8164],{"class":3110,"line":3336},[3108,8137,3140],{"class":3114},[3108,8139,3597],{"class":3118},[3108,8141,7495],{"class":3122},[3108,8143,3127],{"class":3126},[3108,8145,7500],{"class":3130},[3108,8147,7503],{"class":3122},[3108,8149,3127],{"class":3126},[3108,8151,6834],{"class":3130},[3108,8153,4957],{"class":3122},[3108,8155,3127],{"class":3126},[3108,8157,6834],{"class":3130},[3108,8159,3600],{"class":3122},[3108,8161,3127],{"class":3126},[3108,8163,7520],{"class":3130},[3108,8165,3134],{"class":3114},[3108,8167,8168,8170,8172],{"class":3110,"line":3354},[3108,8169,3151],{"class":3114},[3108,8171,3630],{"class":3118},[3108,8173,3134],{"class":3114},[3108,8175,8176,8178,8180],{"class":3110,"line":3378},[3108,8177,3161],{"class":3114},[3108,8179,2987],{"class":3118},[3108,8181,3134],{"class":3114},[3108,8183,8184,8186,8188,8190,8192,8195,8197,8199,8201,8203,8205,8208],{"class":3110,"line":3387},[3108,8185,5031],{"class":3114},[3108,8187,3068],{"class":3118},[3108,8189,3166],{"class":3122},[3108,8191,3127],{"class":3126},[3108,8193,8194],{"class":3130},"\"Width\"",[3108,8196,3174],{"class":3122},[3108,8198,3127],{"class":3126},[3108,8200,3580],{"class":3130},[3108,8202,3301],{"class":3122},[3108,8204,3127],{"class":3126},[3108,8206,8207],{"class":3130},"\"CubicEaseOut\"",[3108,8209,3182],{"class":3114},[3108,8211,8212,8214,8216],{"class":3110,"line":3396},[3108,8213,5150],{"class":3114},[3108,8215,2987],{"class":3118},[3108,8217,3134],{"class":3114},[3108,8219,8220,8222,8224],{"class":3110,"line":3756},[3108,8221,3188],{"class":3114},[3108,8223,3630],{"class":3118},[3108,8225,3134],{"class":3114},[3108,8227,8228,8230,8232,8234,8236,8238],{"class":3110,"line":4513},[3108,8229,3151],{"class":3114},[3108,8231,7529],{"class":3118},[3108,8233,7532],{"class":3122},[3108,8235,3127],{"class":3126},[3108,8237,7537],{"class":3130},[3108,8239,3134],{"class":3114},[3108,8241,8242,8244,8246,8248,8250,8252,8254,8256,8258],{"class":3110,"line":4535},[3108,8243,3161],{"class":3114},[3108,8245,3744],{"class":3118},[3108,8247,3747],{"class":3122},[3108,8249,3127],{"class":3126},[3108,8251,7552],{"class":3130},[3108,8253,7555],{"class":3122},[3108,8255,3127],{"class":3126},[3108,8257,7560],{"class":3130},[3108,8259,3182],{"class":3114},[3108,8261,8262,8264,8266,8268,8270,8272,8274,8276,8278],{"class":3110,"line":4557},[3108,8263,3161],{"class":3114},[3108,8265,3119],{"class":3118},[3108,8267,3123],{"class":3122},[3108,8269,3127],{"class":3126},[3108,8271,7575],{"class":3130},[3108,8273,7532],{"class":3122},[3108,8275,3127],{"class":3126},[3108,8277,7582],{"class":3130},[3108,8279,3182],{"class":3114},[3108,8281,8282,8284,8286,8288,8290,8292,8294,8296,8298],{"class":3110,"line":4566},[3108,8283,3161],{"class":3114},[3108,8285,3119],{"class":3118},[3108,8287,3123],{"class":3122},[3108,8289,3127],{"class":3126},[3108,8291,7597],{"class":3130},[3108,8293,7532],{"class":3122},[3108,8295,3127],{"class":3126},[3108,8297,7582],{"class":3130},[3108,8299,3182],{"class":3114},[3108,8301,8302,8304,8306],{"class":3110,"line":4575},[3108,8303,3188],{"class":3114},[3108,8305,7529],{"class":3118},[3108,8307,3134],{"class":3114},[3108,8309,8310,8312,8314],{"class":3110,"line":5563},[3108,8311,3198],{"class":3114},[3108,8313,3597],{"class":3118},[3108,8315,3134],{"class":3114},[3108,8317,8318],{"class":3110,"line":5584},[3108,8319,7486],{"class":3126},[3108,8321,8322,8324,8326,8328,8330,8332,8334,8336,8338,8340,8342,8344],{"class":3110,"line":5605},[3108,8323,3140],{"class":3114},[3108,8325,3119],{"class":3118},[3108,8327,7503],{"class":3122},[3108,8329,3127],{"class":3126},[3108,8331,6898],{"class":3130},[3108,8333,3123],{"class":3122},[3108,8335,3127],{"class":3126},[3108,8337,7644],{"class":3130},[3108,8339,7647],{"class":3122},[3108,8341,3127],{"class":3126},[3108,8343,7652],{"class":3130},[3108,8345,3182],{"class":3114},[3108,8347,8348,8350,8352],{"class":3110,"line":5614},[3108,8349,3208],{"class":3114},[3108,8351,7431],{"class":3118},[3108,8353,3134],{"class":3114},[3099,8355,8357],{"className":5726,"code":8356,"language":5728,"meta":3104,"style":3104},"// Code-Behind: ~5 рядків\nprivate bool isSidebarVisible = false;\n\nprivate void ToggleSidebar_Click(object sender, RoutedEventArgs e)\n{\n    Sidebar.Width = isSidebarVisible ? 0 : 250;\n    isSidebarVisible = !isSidebarVisible;\n}\n",[2968,8358,8359,8364,8378,8382,8404,8408,8434,8444],{"__ignoreMap":3104},[3108,8360,8361],{"class":3110,"line":3111},[3108,8362,8363],{"class":5735},"// Code-Behind: ~5 рядків\n",[3108,8365,8366,8368,8370,8372,8374,8376],{"class":3110,"line":3137},[3108,8367,7918],{"class":5741},[3108,8369,7921],{"class":5741},[3108,8371,7924],{"class":5745},[3108,8373,5749],{"class":3126},[3108,8375,7929],{"class":5741},[3108,8377,7932],{"class":3126},[3108,8379,8380],{"class":3110,"line":3148},[3108,8381,5929],{"emptyLinePlaceholder":5928},[3108,8383,8384,8386,8388,8390,8392,8394,8396,8398,8400,8402],{"class":3110,"line":3158},[3108,8385,7918],{"class":5741},[3108,8387,7943],{"class":5741},[3108,8389,7946],{"class":5776},[3108,8391,5780],{"class":3126},[3108,8393,7951],{"class":5741},[3108,8395,7954],{"class":5745},[3108,8397,3229],{"class":3126},[3108,8399,7959],{"class":5755},[3108,8401,7962],{"class":5745},[3108,8403,7965],{"class":3126},[3108,8405,8406],{"class":3110,"line":3185},[3108,8407,5761],{"class":3126},[3108,8409,8410,8413,8415,8417,8419,8421,8424,8426,8429,8432],{"class":3110,"line":3195},[3108,8411,8412],{"class":5745},"    Sidebar",[3108,8414,3007],{"class":3126},[3108,8416,3497],{"class":5745},[3108,8418,5749],{"class":3126},[3108,8420,7982],{"class":5745},[3108,8422,8423],{"class":3126}," ? ",[3108,8425,5829],{"class":5783},[3108,8427,8428],{"class":3126}," : ",[3108,8430,8431],{"class":5783},"250",[3108,8433,7932],{"class":3126},[3108,8435,8436,8438,8440,8442],{"class":3110,"line":3205},[3108,8437,8045],{"class":5745},[3108,8439,8048],{"class":3126},[3108,8441,7982],{"class":5745},[3108,8443,7932],{"class":3126},[3108,8445,8446],{"class":3110,"line":3336},[3108,8447,8057],{"class":3126},[2964,8449,8450,8452],{},[2985,8451,8062],{},": ~20 рядків XAML + Code-Behind.",[3041,8454,8456],{"id":8455},"порівняння","Порівняння",[4082,8458,8459,8474],{},[4085,8460,8461],{},[4088,8462,8463,8465,8468,8471],{},[4091,8464,6504],{},[4091,8466,8467],{},"WPF",[4091,8469,8470],{},"Avalonia",[4091,8472,8473],{},"Різниця",[4101,8475,8476,8494,8511,8528,8543],{},[4088,8477,8478,8483,8486,8489],{},[4106,8479,8480],{},[2985,8481,8482],{},"Рядків XAML",[4106,8484,8485],{},"30",[4106,8487,8488],{},"15",[4106,8490,8491],{},[2985,8492,8493],{},"-50%",[4088,8495,8496,8501,8504,8507],{},[4106,8497,8498],{},[2985,8499,8500],{},"Рядків C#",[4106,8502,8503],{},"10",[4106,8505,8506],{},"5",[4106,8508,8509],{},[2985,8510,8493],{},[4088,8512,8513,8518,8521,8523],{},[4106,8514,8515],{},[2985,8516,8517],{},"Storyboard ресурси",[4106,8519,8520],{},"2 (Show/Hide)",[4106,8522,5829],{},[4106,8524,8525],{},[2985,8526,8527],{},"-100%",[4088,8529,8530,8535,8538,8541],{},[4106,8531,8532],{},[2985,8533,8534],{},"FindResource()",[4106,8536,8537],{},"Так",[4106,8539,8540],{},"Ні",[4106,8542,6620],{},[4088,8544,8545,8549,8552,8555],{},[4106,8546,8547],{},[2985,8548,6532],{},[4106,8550,8551],{},"Середня",[4106,8553,8554],{},"Висока",[4106,8556,8557],{},"Зрозуміліше",[2964,8559,8560,8561,2979,8564,8567,8568,8570,8571,8573],{},"Avalonia версія ",[2985,8562,8563],{},"вдвічі коротша",[2985,8565,8566],{},"набагато зрозуміліша",". Не потрібно створювати окремі ",[2968,8569,2970],{}," для \"показати\" та \"сховати\" — ",[2968,8572,3049],{}," автоматично працює в обидва боки.",[3467,8575,8577,8579,8580,3061,8582,8584],{"icon":8576},"lucide:sparkles",[2985,8578,3472],{},": Якщо ви портуєте WPF додаток на Avalonia, почніть з заміни ",[2968,8581,2970],{},[2968,8583,2987],{},". Це одразу зменшить обсяг коду на 30-50% та покращить читабельність.",[3034,8586],{},[2959,8588,8590],{"id":8589},"практичні-завдання","Практичні завдання",[3041,8592,8594],{"id":8593},"рівень-1-hover-анімація-кнопки-через-transition","Рівень 1: Hover-анімація кнопки через Transition",[2964,8596,8597,8600],{},[2985,8598,8599],{},"Мета",": Створити кнопку, яка при наведенні миші плавно змінює колір фону та збільшується на 10%.",[2964,8602,8603,3408],{},[2985,8604,8605],{},"Вимоги",[4044,8607,8608,8616,8622,8625],{},[3413,8609,8610,8611,8613,8614,3007],{},"Використайте ",[2968,8612,3541],{}," для анімації ",[2968,8615,3551],{},[3413,8617,8610,8618,8613,8620,3007],{},[2968,8619,3822],{},[2968,8621,3828],{},[3413,8623,8624],{},"Тривалість анімації — 300 мс.",[3413,8626,8627,8628,3007],{},"Easing функція — ",[2968,8629,3423],{},[2964,8631,8632,3408],{},[2985,8633,8634],{},"Підказка",[3099,8636,8638],{"className":3101,"code":8637,"language":3103,"meta":3104,"style":3104},"\u003CButton Content=\"Наведи на мене\" Background=\"DodgerBlue\" RenderTransformOrigin=\"0.5, 0.5\">\n    \u003CButton.Transitions>\n        \u003CTransitions>\n            \u003C!-- Додайте BrushTransition та TransformOperationsTransition -->\n        \u003C/Transitions>\n    \u003C/Button.Transitions>\n    \u003CButton.Styles>\n        \u003CStyle Selector=\"Button:pointerover\">\n            \u003C!-- Встановіть Background=\"LightCoral\" та RenderTransform=\"scale(1.1)\" -->\n        \u003C/Style>\n    \u003C/Button.Styles>\n\u003C/Button>\n",[2968,8639,8640,8666,8674,8682,8687,8695,8703,8711,8725,8730,8738,8746],{"__ignoreMap":3104},[3108,8641,8642,8644,8646,8648,8650,8652,8654,8656,8658,8660,8662,8664],{"class":3110,"line":3111},[3108,8643,3115],{"class":3114},[3108,8645,3119],{"class":3118},[3108,8647,3123],{"class":3122},[3108,8649,3127],{"class":3126},[3108,8651,3131],{"class":3130},[3108,8653,3600],{"class":3122},[3108,8655,3127],{"class":3126},[3108,8657,4976],{"class":3130},[3108,8659,3886],{"class":3122},[3108,8661,3127],{"class":3126},[3108,8663,3891],{"class":3130},[3108,8665,3134],{"class":3114},[3108,8667,8668,8670,8672],{"class":3110,"line":3137},[3108,8669,3140],{"class":3114},[3108,8671,3143],{"class":3118},[3108,8673,3134],{"class":3114},[3108,8675,8676,8678,8680],{"class":3110,"line":3148},[3108,8677,3151],{"class":3114},[3108,8679,2987],{"class":3118},[3108,8681,3134],{"class":3114},[3108,8683,8684],{"class":3110,"line":3158},[3108,8685,8686],{"class":5735},"            \u003C!-- Додайте BrushTransition та TransformOperationsTransition -->\n",[3108,8688,8689,8691,8693],{"class":3110,"line":3185},[3108,8690,3188],{"class":3114},[3108,8692,2987],{"class":3118},[3108,8694,3134],{"class":3114},[3108,8696,8697,8699,8701],{"class":3110,"line":3195},[3108,8698,3198],{"class":3114},[3108,8700,3143],{"class":3118},[3108,8702,3134],{"class":3114},[3108,8704,8705,8707,8709],{"class":3110,"line":3205},[3108,8706,3140],{"class":3114},[3108,8708,3331],{"class":3118},[3108,8710,3134],{"class":3114},[3108,8712,8713,8715,8717,8719,8721,8723],{"class":3110,"line":3336},[3108,8714,3151],{"class":3114},[3108,8716,3341],{"class":3118},[3108,8718,3344],{"class":3122},[3108,8720,3127],{"class":3126},[3108,8722,3349],{"class":3130},[3108,8724,3134],{"class":3114},[3108,8726,8727],{"class":3110,"line":3354},[3108,8728,8729],{"class":5735},"            \u003C!-- Встановіть Background=\"LightCoral\" та RenderTransform=\"scale(1.1)\" -->\n",[3108,8731,8732,8734,8736],{"class":3110,"line":3378},[3108,8733,3188],{"class":3114},[3108,8735,3341],{"class":3118},[3108,8737,3134],{"class":3114},[3108,8739,8740,8742,8744],{"class":3110,"line":3387},[3108,8741,3198],{"class":3114},[3108,8743,3331],{"class":3118},[3108,8745,3134],{"class":3114},[3108,8747,8748,8750,8752],{"class":3110,"line":3396},[3108,8749,3208],{"class":3114},[3108,8751,3119],{"class":3118},[3108,8753,3134],{"class":3114},[2964,8755,8756,8759],{},[2985,8757,8758],{},"Очікуваний результат",": При наведенні миші кнопка плавно змінює колір з синього на коралловий та збільшується на 10%. При прибиранні миші — повертається до початкового стану.",[3034,8761],{},[3041,8763,8765],{"id":8764},"рівень-2-keyframe-анімація-обертання","Рівень 2: KeyFrame анімація обертання",[2964,8767,8768,8770],{},[2985,8769,8599],{},": Створити іконку завантаження (spinner), яка безперервно обертається на 360 градусів.",[2964,8772,8773,3408],{},[2985,8774,8605],{},[4044,8776,8777,8788,8794,8797],{},[3413,8778,8610,8779,8781,8782,8784,8785,8787],{},[2968,8780,6961],{}," з двома кадрами: ",[2968,8783,4905],{}," (0 градусів) та ",[2968,8786,4913],{}," (360 градусів).",[3413,8789,8790,8791,4276],{},"Анімація має повторюватися нескінченно (",[2968,8792,8793],{},"IterationCount=\"Infinite\"",[3413,8795,8796],{},"Тривалість одного обертання — 1.5 секунди.",[3413,8798,8610,8799,8801],{},[2968,8800,4110],{}," для рівномірного обертання.",[2964,8803,8804,3408],{},[2985,8805,8634],{},[3099,8807,8809],{"className":3101,"code":8808,"language":3103,"meta":3104,"style":3104},"\u003CBorder Width=\"50\" Height=\"50\" Background=\"Transparent\" RenderTransformOrigin=\"0.5, 0.5\">\n    \u003CBorder.Styles>\n        \u003CStyle Selector=\"Border\">\n            \u003CStyle.Animations>\n                \u003CAnimation Duration=\"0:0:1.5\" IterationCount=\"Infinite\">\n                    \u003CKeyFrame Cue=\"0%\">\n                        \u003CSetter Property=\"RenderTransform\" Value=\"rotate(0deg)\"/>\n                    \u003C/KeyFrame>\n                    \u003CKeyFrame Cue=\"100%\">\n                        \u003C!-- Додайте rotate(360deg) -->\n                    \u003C/KeyFrame>\n                \u003C/Animation>\n            \u003C/Style.Animations>\n        \u003C/Style>\n    \u003C/Border.Styles>\n    \u003CPath Data=\"M 25,5 A 20,20 0 1,1 24.9,5\" Stroke=\"DodgerBlue\" StrokeThickness=\"4\"/>\n\u003C/Border>\n",[2968,8810,8811,8845,8853,8867,8875,8896,8910,8930,8938,8952,8957,8965,8973,8981,8989,8997,9029],{"__ignoreMap":3104},[3108,8812,8813,8815,8817,8819,8821,8824,8826,8828,8830,8832,8834,8837,8839,8841,8843],{"class":3110,"line":3111},[3108,8814,3115],{"class":3114},[3108,8816,3597],{"class":3118},[3108,8818,4957],{"class":3122},[3108,8820,3127],{"class":3126},[3108,8822,8823],{"class":3130},"\"50\"",[3108,8825,4965],{"class":3122},[3108,8827,3127],{"class":3126},[3108,8829,8823],{"class":3130},[3108,8831,3600],{"class":3122},[3108,8833,3127],{"class":3126},[3108,8835,8836],{"class":3130},"\"Transparent\"",[3108,8838,3886],{"class":3122},[3108,8840,3127],{"class":3126},[3108,8842,3891],{"class":3130},[3108,8844,3134],{"class":3114},[3108,8846,8847,8849,8851],{"class":3110,"line":3137},[3108,8848,3140],{"class":3114},[3108,8850,3683],{"class":3118},[3108,8852,3134],{"class":3114},[3108,8854,8855,8857,8859,8861,8863,8865],{"class":3110,"line":3148},[3108,8856,3151],{"class":3114},[3108,8858,3341],{"class":3118},[3108,8860,3344],{"class":3122},[3108,8862,3127],{"class":3126},[3108,8864,5015],{"class":3130},[3108,8866,3134],{"class":3114},[3108,8868,8869,8871,8873],{"class":3110,"line":3158},[3108,8870,3161],{"class":3114},[3108,8872,5024],{"class":3118},[3108,8874,3134],{"class":3114},[3108,8876,8877,8879,8881,8883,8885,8888,8890,8892,8894],{"class":3110,"line":3185},[3108,8878,5031],{"class":3114},[3108,8880,3027],{"class":3118},[3108,8882,3174],{"class":3122},[3108,8884,3127],{"class":3126},[3108,8886,8887],{"class":3130},"\"0:0:1.5\"",[3108,8889,4729],{"class":3122},[3108,8891,3127],{"class":3126},[3108,8893,4734],{"class":3130},[3108,8895,3134],{"class":3114},[3108,8897,8898,8900,8902,8904,8906,8908],{"class":3110,"line":3195},[3108,8899,5052],{"class":3114},[3108,8901,3031],{"class":3118},[3108,8903,4745],{"class":3122},[3108,8905,3127],{"class":3126},[3108,8907,4750],{"class":3130},[3108,8909,3134],{"class":3114},[3108,8911,8912,8914,8916,8918,8920,8922,8924,8926,8928],{"class":3110,"line":3205},[3108,8913,5067],{"class":3114},[3108,8915,3359],{"class":3118},[3108,8917,3166],{"class":3122},[3108,8919,3127],{"class":3126},[3108,8921,3847],{"class":3130},[3108,8923,3368],{"class":3122},[3108,8925,3127],{"class":3126},[3108,8927,5082],{"class":3130},[3108,8929,3182],{"class":3114},[3108,8931,8932,8934,8936],{"class":3110,"line":3336},[3108,8933,5089],{"class":3114},[3108,8935,3031],{"class":3118},[3108,8937,3134],{"class":3114},[3108,8939,8940,8942,8944,8946,8948,8950],{"class":3110,"line":3354},[3108,8941,5052],{"class":3114},[3108,8943,3031],{"class":3118},[3108,8945,4745],{"class":3122},[3108,8947,3127],{"class":3126},[3108,8949,4837],{"class":3130},[3108,8951,3134],{"class":3114},[3108,8953,8954],{"class":3110,"line":3378},[3108,8955,8956],{"class":5735},"                        \u003C!-- Додайте rotate(360deg) -->\n",[3108,8958,8959,8961,8963],{"class":3110,"line":3387},[3108,8960,5089],{"class":3114},[3108,8962,3031],{"class":3118},[3108,8964,3134],{"class":3114},[3108,8966,8967,8969,8971],{"class":3110,"line":3396},[3108,8968,5141],{"class":3114},[3108,8970,3027],{"class":3118},[3108,8972,3134],{"class":3114},[3108,8974,8975,8977,8979],{"class":3110,"line":3756},[3108,8976,5150],{"class":3114},[3108,8978,5024],{"class":3118},[3108,8980,3134],{"class":3114},[3108,8982,8983,8985,8987],{"class":3110,"line":4513},[3108,8984,3188],{"class":3114},[3108,8986,3341],{"class":3118},[3108,8988,3134],{"class":3114},[3108,8990,8991,8993,8995],{"class":3110,"line":4535},[3108,8992,3198],{"class":3114},[3108,8994,3683],{"class":3118},[3108,8996,3134],{"class":3114},[3108,8998,8999,9001,9004,9007,9009,9012,9015,9017,9019,9022,9024,9027],{"class":3110,"line":4557},[3108,9000,3140],{"class":3114},[3108,9002,9003],{"class":3118},"Path",[3108,9005,9006],{"class":3122}," Data",[3108,9008,3127],{"class":3126},[3108,9010,9011],{"class":3130},"\"M 25,5 A 20,20 0 1,1 24.9,5\"",[3108,9013,9014],{"class":3122}," Stroke",[3108,9016,3127],{"class":3126},[3108,9018,4976],{"class":3130},[3108,9020,9021],{"class":3122}," StrokeThickness",[3108,9023,3127],{"class":3126},[3108,9025,9026],{"class":3130},"\"4\"",[3108,9028,3182],{"class":3114},[3108,9030,9031,9033,9035],{"class":3110,"line":4566},[3108,9032,3208],{"class":3114},[3108,9034,3597],{"class":3118},[3108,9036,3134],{"class":3114},[2964,9038,9039,9041],{},[2985,9040,8758],{},": Іконка безперервно обертається по годинниковій стрілці.",[3034,9043],{},[3041,9045,9047],{"id":9046},"рівень-3-портувати-sidebar-анімацію-з-wpf-на-avalonia-transitions","Рівень 3: Портувати sidebar-анімацію з WPF на Avalonia Transitions",[2964,9049,9050,9052,9053,3007],{},[2985,9051,8599],{},": Взяти WPF приклад з бічною панеллю (sidebar) та повністю портувати його на Avalonia з використанням ",[2968,9054,2987],{},[2964,9056,9057,3408],{},[2985,9058,8605],{},[4044,9060,9061,9075,9084,9090,9095,9101],{},[3413,9062,9063,9064,9066,9067,9070,9071,9074],{},"Створіть ",[2968,9065,7431],{}," з двома колонками: ",[2968,9068,9069],{},"Auto"," (для sidebar) та ",[2968,9072,9073],{},"*"," (для основного контенту).",[3413,9076,9077,9078,9080,9081,3007],{},"Sidebar має початкову ширину ",[2968,9079,5829],{}," та фон ",[2968,9082,9083],{},"LightGray",[3413,9085,9086,9087,9089],{},"При натисканні кнопки \"Показати меню\" sidebar розширюється до ",[2968,9088,8431],{}," пікселів.",[3413,9091,9092,9093,3007],{},"При повторному натисканні — згортається назад до ",[2968,9094,5829],{},[3413,9096,8610,9097,8613,9099,3007],{},[2968,9098,3068],{},[2968,9100,3497],{},[3413,9102,9103,9104,3007],{},"Тривалість анімації — 400 мс, easing — ",[2968,9105,9106],{},"CubicEaseOut",[2964,9108,9109,3408],{},[2985,9110,8634],{},[3099,9112,9114],{"className":3101,"code":9113,"language":3103,"meta":3104,"style":3104},"\u003CGrid>\n    \u003CGrid.ColumnDefinitions>\n        \u003CColumnDefinition Width=\"Auto\"/>\n        \u003CColumnDefinition Width=\"*\"/>\n    \u003C/Grid.ColumnDefinitions>\n    \n    \u003CBorder x:Name=\"Sidebar\" Grid.Column=\"0\" Width=\"0\" Background=\"LightGray\">\n        \u003CBorder.Transitions>\n            \u003C!-- Додайте DoubleTransition для Width -->\n        \u003C/Border.Transitions>\n        \u003CStackPanel Margin=\"10\">\n            \u003CTextBlock Text=\"Меню\" FontWeight=\"Bold\"/>\n            \u003CButton Content=\"Пункт 1\" Margin=\"0,5\"/>\n            \u003CButton Content=\"Пункт 2\" Margin=\"0,5\"/>\n            \u003CButton Content=\"Пункт 3\" Margin=\"0,5\"/>\n        \u003C/StackPanel>\n    \u003C/Border>\n    \n    \u003CStackPanel Grid.Column=\"1\" Margin=\"20\">\n        \u003CButton Content=\"Показати меню\" Click=\"ToggleSidebar_Click\"/>\n        \u003CTextBlock Text=\"Основний контент\" Margin=\"0,20\"/>\n    \u003C/StackPanel>\n\u003C/Grid>\n",[2968,9115,9116,9124,9132,9146,9160,9168,9172,9204,9212,9217,9225,9239,9259,9279,9299,9320,9328,9336,9340,9360,9380,9402,9410],{"__ignoreMap":3104},[3108,9117,9118,9120,9122],{"class":3110,"line":3111},[3108,9119,3115],{"class":3114},[3108,9121,7431],{"class":3118},[3108,9123,3134],{"class":3114},[3108,9125,9126,9128,9130],{"class":3110,"line":3137},[3108,9127,3140],{"class":3114},[3108,9129,7440],{"class":3118},[3108,9131,3134],{"class":3114},[3108,9133,9134,9136,9138,9140,9142,9144],{"class":3110,"line":3148},[3108,9135,3151],{"class":3114},[3108,9137,7449],{"class":3118},[3108,9139,4957],{"class":3122},[3108,9141,3127],{"class":3126},[3108,9143,7456],{"class":3130},[3108,9145,3182],{"class":3114},[3108,9147,9148,9150,9152,9154,9156,9158],{"class":3110,"line":3158},[3108,9149,3151],{"class":3114},[3108,9151,7449],{"class":3118},[3108,9153,4957],{"class":3122},[3108,9155,3127],{"class":3126},[3108,9157,7471],{"class":3130},[3108,9159,3182],{"class":3114},[3108,9161,9162,9164,9166],{"class":3110,"line":3185},[3108,9163,3198],{"class":3114},[3108,9165,7440],{"class":3118},[3108,9167,3134],{"class":3114},[3108,9169,9170],{"class":3110,"line":3195},[3108,9171,7486],{"class":3126},[3108,9173,9174,9176,9178,9180,9182,9184,9186,9188,9190,9192,9194,9196,9198,9200,9202],{"class":3110,"line":3205},[3108,9175,3140],{"class":3114},[3108,9177,3597],{"class":3118},[3108,9179,7495],{"class":3122},[3108,9181,3127],{"class":3126},[3108,9183,7500],{"class":3130},[3108,9185,7503],{"class":3122},[3108,9187,3127],{"class":3126},[3108,9189,6834],{"class":3130},[3108,9191,4957],{"class":3122},[3108,9193,3127],{"class":3126},[3108,9195,6834],{"class":3130},[3108,9197,3600],{"class":3122},[3108,9199,3127],{"class":3126},[3108,9201,7520],{"class":3130},[3108,9203,3134],{"class":3114},[3108,9205,9206,9208,9210],{"class":3110,"line":3336},[3108,9207,3151],{"class":3114},[3108,9209,3630],{"class":3118},[3108,9211,3134],{"class":3114},[3108,9213,9214],{"class":3110,"line":3354},[3108,9215,9216],{"class":5735},"            \u003C!-- Додайте DoubleTransition для Width -->\n",[3108,9218,9219,9221,9223],{"class":3110,"line":3378},[3108,9220,3188],{"class":3114},[3108,9222,3630],{"class":3118},[3108,9224,3134],{"class":3114},[3108,9226,9227,9229,9231,9233,9235,9237],{"class":3110,"line":3387},[3108,9228,3151],{"class":3114},[3108,9230,7529],{"class":3118},[3108,9232,7532],{"class":3122},[3108,9234,3127],{"class":3126},[3108,9236,7537],{"class":3130},[3108,9238,3134],{"class":3114},[3108,9240,9241,9243,9245,9247,9249,9251,9253,9255,9257],{"class":3110,"line":3396},[3108,9242,3161],{"class":3114},[3108,9244,3744],{"class":3118},[3108,9246,3747],{"class":3122},[3108,9248,3127],{"class":3126},[3108,9250,7552],{"class":3130},[3108,9252,7555],{"class":3122},[3108,9254,3127],{"class":3126},[3108,9256,7560],{"class":3130},[3108,9258,3182],{"class":3114},[3108,9260,9261,9263,9265,9267,9269,9271,9273,9275,9277],{"class":3110,"line":3756},[3108,9262,3161],{"class":3114},[3108,9264,3119],{"class":3118},[3108,9266,3123],{"class":3122},[3108,9268,3127],{"class":3126},[3108,9270,7575],{"class":3130},[3108,9272,7532],{"class":3122},[3108,9274,3127],{"class":3126},[3108,9276,7582],{"class":3130},[3108,9278,3182],{"class":3114},[3108,9280,9281,9283,9285,9287,9289,9291,9293,9295,9297],{"class":3110,"line":4513},[3108,9282,3161],{"class":3114},[3108,9284,3119],{"class":3118},[3108,9286,3123],{"class":3122},[3108,9288,3127],{"class":3126},[3108,9290,7597],{"class":3130},[3108,9292,7532],{"class":3122},[3108,9294,3127],{"class":3126},[3108,9296,7582],{"class":3130},[3108,9298,3182],{"class":3114},[3108,9300,9301,9303,9305,9307,9309,9312,9314,9316,9318],{"class":3110,"line":4535},[3108,9302,3161],{"class":3114},[3108,9304,3119],{"class":3118},[3108,9306,3123],{"class":3122},[3108,9308,3127],{"class":3126},[3108,9310,9311],{"class":3130},"\"Пункт 3\"",[3108,9313,7532],{"class":3122},[3108,9315,3127],{"class":3126},[3108,9317,7582],{"class":3130},[3108,9319,3182],{"class":3114},[3108,9321,9322,9324,9326],{"class":3110,"line":4557},[3108,9323,3188],{"class":3114},[3108,9325,7529],{"class":3118},[3108,9327,3134],{"class":3114},[3108,9329,9330,9332,9334],{"class":3110,"line":4566},[3108,9331,3198],{"class":3114},[3108,9333,3597],{"class":3118},[3108,9335,3134],{"class":3114},[3108,9337,9338],{"class":3110,"line":4575},[3108,9339,7486],{"class":3126},[3108,9341,9342,9344,9346,9348,9350,9352,9354,9356,9358],{"class":3110,"line":5563},[3108,9343,3140],{"class":3114},[3108,9345,7529],{"class":3118},[3108,9347,7503],{"class":3122},[3108,9349,3127],{"class":3126},[3108,9351,6898],{"class":3130},[3108,9353,7532],{"class":3122},[3108,9355,3127],{"class":3126},[3108,9357,3621],{"class":3130},[3108,9359,3134],{"class":3114},[3108,9361,9362,9364,9366,9368,9370,9372,9374,9376,9378],{"class":3110,"line":5584},[3108,9363,3151],{"class":3114},[3108,9365,3119],{"class":3118},[3108,9367,3123],{"class":3122},[3108,9369,3127],{"class":3126},[3108,9371,7644],{"class":3130},[3108,9373,7647],{"class":3122},[3108,9375,3127],{"class":3126},[3108,9377,7652],{"class":3130},[3108,9379,3182],{"class":3114},[3108,9381,9382,9384,9386,9388,9390,9393,9395,9397,9400],{"class":3110,"line":5605},[3108,9383,3151],{"class":3114},[3108,9385,3744],{"class":3118},[3108,9387,3747],{"class":3122},[3108,9389,3127],{"class":3126},[3108,9391,9392],{"class":3130},"\"Основний контент\"",[3108,9394,7532],{"class":3122},[3108,9396,3127],{"class":3126},[3108,9398,9399],{"class":3130},"\"0,20\"",[3108,9401,3182],{"class":3114},[3108,9403,9404,9406,9408],{"class":3110,"line":5614},[3108,9405,3198],{"class":3114},[3108,9407,7529],{"class":3118},[3108,9409,3134],{"class":3114},[3108,9411,9412,9414,9416],{"class":3110,"line":5623},[3108,9413,3208],{"class":3114},[3108,9415,7431],{"class":3118},[3108,9417,3134],{"class":3114},[3099,9419,9421],{"className":5726,"code":9420,"language":5728,"meta":3104,"style":3104},"// Code-Behind\nprivate bool isSidebarVisible = false;\n\nprivate void ToggleSidebar_Click(object sender, RoutedEventArgs e)\n{\n    // Додайте логіку перемикання Width між 0 та 250\n}\n",[2968,9422,9423,9428,9442,9446,9468,9472,9477],{"__ignoreMap":3104},[3108,9424,9425],{"class":3110,"line":3111},[3108,9426,9427],{"class":5735},"// Code-Behind\n",[3108,9429,9430,9432,9434,9436,9438,9440],{"class":3110,"line":3137},[3108,9431,7918],{"class":5741},[3108,9433,7921],{"class":5741},[3108,9435,7924],{"class":5745},[3108,9437,5749],{"class":3126},[3108,9439,7929],{"class":5741},[3108,9441,7932],{"class":3126},[3108,9443,9444],{"class":3110,"line":3148},[3108,9445,5929],{"emptyLinePlaceholder":5928},[3108,9447,9448,9450,9452,9454,9456,9458,9460,9462,9464,9466],{"class":3110,"line":3158},[3108,9449,7918],{"class":5741},[3108,9451,7943],{"class":5741},[3108,9453,7946],{"class":5776},[3108,9455,5780],{"class":3126},[3108,9457,7951],{"class":5741},[3108,9459,7954],{"class":5745},[3108,9461,3229],{"class":3126},[3108,9463,7959],{"class":5755},[3108,9465,7962],{"class":5745},[3108,9467,7965],{"class":3126},[3108,9469,9470],{"class":3110,"line":3185},[3108,9471,5761],{"class":3126},[3108,9473,9474],{"class":3110,"line":3195},[3108,9475,9476],{"class":5735},"    // Додайте логіку перемикання Width між 0 та 250\n",[3108,9478,9479],{"class":3110,"line":3205},[3108,9480,8057],{"class":3126},[2964,9482,9483,9485],{},[2985,9484,8758],{},": При натисканні кнопки sidebar плавно висувається з лівого краю. При повторному натисканні — плавно ховається.",[2964,9487,9488,9491,9492,9494,9495,3454,9497,9499],{},[2985,9489,9490],{},"Бонус",": Додайте анімацію ",[2968,9493,3056],{}," для sidebar (від ",[2968,9496,5829],{},[2968,9498,5784],{},"), щоб панель не тільки висувалася, але й плавно з'являлася.",[3034,9501],{},[2959,9503,9505],{"id":9504},"резюме","Резюме",[2964,9507,9508,9509,9512,9513,3028,9515,2979,9517,9519],{},"Avalonia пропонує ",[2985,9510,9511],{},"революційно простіший підхід до анімацій"," порівняно з WPF. Замість складних ",[2968,9514,2970],{},[2968,9516,3228],{},[2968,9518,6049],{},", ви використовуєте:",[3410,9521,9522,9527,9539],{},[3413,9523,9524,9526],{},[2985,9525,2987],{}," — для простих анімацій властивостей. Визначаєте, яку властивість анімувати, тривалість та easing — все інше відбувається автоматично.",[3413,9528,9529,9531,9532,9534,9535,2979,9537,3007],{},[2985,9530,4675],{}," — для складних сценаріїв з кількома етапами. CSS-подібний синтаксис з ",[2968,9533,4701],{}," (відсотки часу) замість ",[2968,9536,6672],{},[2968,9538,4886],{},[3413,9540,9541,9544,9545,3229,9547,3229,9549,9551,9552,3007],{},[2985,9542,9543],{},"Pseudo-classes"," — для інтеграції анімацій зі стилями. ",[2968,9546,3432],{},[2968,9548,4067],{},[2968,9550,4297],{}," автоматично застосовують стилі, які анімуються через ",[2968,9553,2987],{},[2964,9555,9556,3408],{},[2985,9557,9558],{},"Ключові переваги Avalonia",[4044,9560,9561,9565,9575,9580],{},[3413,9562,9563,6615],{},[2985,9564,6614],{},[3413,9566,9567,6621,9569,3229,9571,3229,9573,3007],{},[2985,9568,6620],{},[2968,9570,2978],{},[2968,9572,2982],{},[2968,9574,6049],{},[3413,9576,9577,9579],{},[2985,9578,6632],{},": Описуєте \"що\" анімувати, а не \"як\".",[3413,9581,9582,9584],{},[2985,9583,6644],{},": Transitions працюють в обидва боки без додаткового коду.",[2964,9586,9587,9588,3061,9590,9592],{},"Якщо ви портуєте WPF додаток на Avalonia, заміна ",[2968,9589,2970],{},[2968,9591,2987],{}," — це перше, що варто зробити. Це одразу зменшить обсяг коду та покращить читабельність.",[3034,9594],{},[2959,9596,9598],{"id":9597},"словник-термінів","Словник термінів",[3012,9600,9601,9606],{"icon":4037},[2964,9602,9603,3408],{},[2985,9604,9605],{},"Основні терміни",[4044,9607,9608,9616,9621,9628,9639,9645,9653,9660],{},[3413,9609,9610,9612,9613,3007],{},[2985,9611,3049],{}," — механізм автоматичної анімації зміни властивості. Визначається через ",[2968,9614,9615],{},"\u003CButton.Transitions>",[3413,9617,9618,9620],{},[2985,9619,6961],{}," — анімація з кількома ключовими кадрами, кожен з яких визначає стан властивостей у певний момент часу.",[3413,9622,9623,9625,9626,3007],{},[2985,9624,4701],{}," — відсоток часу анімації (0% — початок, 100% — кінець). Використовується у ",[2968,9627,3031],{},[3413,9629,9630,4062,9632,3229,9634,3229,9636,9638],{},[2985,9631,4061],{},[2968,9633,3432],{},[2968,9635,4067],{},[2968,9637,4297],{},"). Аналог WPF Triggers.",[3413,9640,9641,9644],{},[2985,9642,9643],{},"Easing Function"," — функція пом'якшення, яка визначає темп анімації (лінійний, прискорення, уповільнення, відскок тощо).",[3413,9646,9647,9649,9650,9652],{},[2985,9648,5233],{}," — точка, навколо якої відбувається трансформація (обертання, масштабування). Значення ",[2968,9651,5237],{}," означає центр елемента.",[3413,9654,9655,9657,9658,4897],{},[2985,9656,4892],{}," — кількість повторень анімації. ",[2968,9659,4896],{},[3413,9661,9662,9664,9665,4276],{},[2985,9663,3822],{}," — тип переходу для анімації трансформацій (",[2968,9666,3828],{},[3034,9668],{},[2959,9670,9672],{"id":9671},"додаткові-ресурси","Додаткові ресурси",[6601,9674,9675,9682,9688,9694],{},[6604,9676,9681],{"icon":9677,"title":9678,"href":9679,"target":9680},"lucide:book-open","Avalonia Animations Documentation","https://docs.avaloniaui.net/docs/animations/transitions","_blank","Офіційна документація Avalonia про Transitions та KeyFrame анімації.",[6604,9683,9687],{"icon":9684,"title":9685,"href":9686,"target":9680},"lucide:youtube","Avalonia Animations Tutorial","https://www.youtube.com/results?search_query=avalonia+animations+tutorial","Відеоуроки на YouTube про створення анімацій в Avalonia.",[6604,9689,9693],{"icon":9690,"title":9691,"href":9692,"target":9680},"lucide:github","Avalonia Samples — Animations","https://github.com/AvaloniaUI/Avalonia.Samples","Репозиторій з прикладами коду Avalonia, включаючи розділ про анімації.",[6604,9695,9699],{"icon":9696,"title":9697,"href":9698,"target":9680},"lucide:palette","Easing Functions Visualizer","https://easings.net/","Інтерактивна візуалізація функцій пом'якшення (easing functions) для вибору оптимального ефекту.",[3034,9701],{},[2964,9703,9704,6666,9707,9712],{},[2985,9705,9706],{},"Наступна стаття",[9708,9709,9711],"a",{"href":9710},"./40.media-graphics","2D/3D графіка та мультимедіа"," — використання графічних примітивів, Path, Brushes, Geometries та MediaElement у WPF.",[9714,9715,9716],"style",{},"html pre.shiki code .s0P7L, html code.shiki .s0P7L{--shiki-light:#800000;--shiki-default:#808080;--shiki-dark:#808080}html pre.shiki code .sKtos, html code.shiki .sKtos{--shiki-light:#800000;--shiki-default:#569CD6;--shiki-dark:#569CD6}html pre.shiki code .sa4r_, html code.shiki .sa4r_{--shiki-light:#E50000;--shiki-default:#9CDCFE;--shiki-dark:#9CDCFE}html pre.shiki code .sHH4Y, html code.shiki .sHH4Y{--shiki-light:#000000;--shiki-default:#D4D4D4;--shiki-dark:#D4D4D4}html pre.shiki code .su9tN, html code.shiki .su9tN{--shiki-light:#0000FF;--shiki-default:#CE9178;--shiki-dark:#CE9178}html .light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html.light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html .default .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html.dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html pre.shiki code .spJ8K, html code.shiki .spJ8K{--shiki-light:#008000;--shiki-default:#6A9955;--shiki-dark:#6A9955}html pre.shiki code .su1O8, html code.shiki .su1O8{--shiki-light:#0000FF;--shiki-default:#569CD6;--shiki-dark:#569CD6}html pre.shiki code .siwwj, html code.shiki .siwwj{--shiki-light:#001080;--shiki-default:#9CDCFE;--shiki-dark:#9CDCFE}html pre.shiki code .sN1BT, html code.shiki .sN1BT{--shiki-light:#267F99;--shiki-default:#4EC9B0;--shiki-dark:#4EC9B0}html pre.shiki code .s8Opu, html code.shiki .s8Opu{--shiki-light:#795E26;--shiki-default:#DCDCAA;--shiki-dark:#DCDCAA}html pre.shiki code .sJj4R, html code.shiki .sJj4R{--shiki-light:#098658;--shiki-default:#B5CEA8;--shiki-dark:#B5CEA8}html pre.shiki code .sbdoH, html code.shiki .sbdoH{--shiki-light:#A31515;--shiki-default:#CE9178;--shiki-dark:#CE9178}",{"title":3104,"searchDepth":3137,"depth":3137,"links":9718},[9719,9720,9725,9731,9732,9736,9742,9747,9754,9760,9765,9766,9767],{"id":2961,"depth":3137,"text":2962},{"id":3038,"depth":3137,"text":3039,"children":9721},[9722,9723,9724],{"id":3043,"depth":3148,"text":3044},{"id":3079,"depth":3148,"text":3080},{"id":3221,"depth":3148,"text":3222},{"id":3478,"depth":3137,"text":3479,"children":9726},[9727,9728,9729,9730],{"id":3485,"depth":3148,"text":3068},{"id":3540,"depth":3148,"text":3541},{"id":3774,"depth":3148,"text":3775},{"id":3821,"depth":3148,"text":3822},{"id":4076,"depth":3137,"text":4077},{"id":4253,"depth":3137,"text":4254,"children":9733},[9734,9735],{"id":4264,"depth":3148,"text":4265},{"id":4317,"depth":3148,"text":4318},{"id":4662,"depth":3137,"text":4663,"children":9737},[9738,9739,9740,9741],{"id":4682,"depth":3148,"text":4683},{"id":4939,"depth":3148,"text":4940},{"id":5251,"depth":3148,"text":5252},{"id":5716,"depth":3148,"text":5717},{"id":5965,"depth":3137,"text":5966,"children":9743},[9744,9745,9746],{"id":5972,"depth":3148,"text":5973},{"id":6337,"depth":3148,"text":6338},{"id":6494,"depth":3148,"text":6495},{"id":6687,"depth":3137,"text":6688,"children":9748},[9749,9750,9751,9752,9753],{"id":6691,"depth":3148,"text":6692},{"id":6763,"depth":3148,"text":6764},{"id":6948,"depth":3148,"text":6949},{"id":7203,"depth":3148,"text":7204},{"id":7259,"depth":3148,"text":7260},{"id":7392,"depth":3137,"text":7393,"children":9755},[9756,9757,9758,9759],{"id":7399,"depth":3148,"text":7400},{"id":7413,"depth":3148,"text":7414},{"id":8066,"depth":3148,"text":8067},{"id":8455,"depth":3148,"text":8456},{"id":8589,"depth":3137,"text":8590,"children":9761},[9762,9763,9764],{"id":8593,"depth":3148,"text":8594},{"id":8764,"depth":3148,"text":8765},{"id":9046,"depth":3148,"text":9047},{"id":9504,"depth":3137,"text":9505},{"id":9597,"depth":3137,"text":9598},{"id":9671,"depth":3137,"text":9672},"Transitions та KeyFrame анімації в Avalonia UI — простіший підхід до анімацій порівняно з WPF","md",null,{"aside":5928,"outline":9772},[3137,3148],{"title":1597,"description":9768},"kszDkv3PAk2sfrClwSqxWi56plLhNlV5UtGLDDHKgpA",[9776,9778],{"title":1593,"path":1594,"stem":1595,"description":9777,"children":-1},"Створення плавних анімацій для інтерактивних інтерфейсів. Storyboard, DoubleAnimation, ColorAnimation, Easing Functions, Event Triggers та code-behind анімації.",{"title":1601,"path":1602,"stem":1603,"description":9779,"children":-1},"Векторна графіка через Shapes та Path. Градієнти, геометрії, трансформації. MediaElement для відео та аудіо. Створення складних візуальних ефектів.",1777912380017]