[{"data":1,"prerenderedAt":9920},["ShallowReactive",2],{"navigation_docs":3,"-csharp-desktop-ui-basic-controls":2949,"-csharp-desktop-ui-basic-controls-surround":9915},[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":1417,"body":2951,"description":9909,"extension":9910,"links":9911,"meta":9912,"navigation":3317,"path":1418,"seo":9913,"stem":1419,"__hash__":9914},"docs/01.csharp/12.desktop-ui/10.basic-controls.md",{"type":2952,"value":2953,"toc":9859},"minimark",[2954,3008,3013,3021,3033,3040,3048,3051,3055,3060,3072,3078,3385,3412,3416,3422,3446,3468,3704,3708,3742,3752,4044,4075,4107,4109,4113,4117,4135,4138,4161,4484,4503,4505,4509,4513,4532,4549,4618,4633,4867,4887,4889,4893,4897,4918,4922,4933,4936,4990,5005,5009,5012,5015,5023,5026,5073,5086,5089,5171,5175,5202,5270,5414,5435,5439,5452,5455,5496,5499,5679,5847,6015,6183,6207,6210,6300,6312,6314,6318,6322,6325,6333,6347,6351,6426,6430,6442,6448,6741,6770,6774,6784,7031,7037,7041,7047,7078,7101,7127,7129,7133,7137,7161,7167,7173,7237,7241,7323,7327,7330,7708,7712,7724,7740,8048,8086,8137,8150,8152,8156,8160,8166,8178,8182,8188,8375,8391,8465,8469,8479,8852,8855,8857,8861,8865,8872,8880,8912,8978,9414,9437,9460,9462,9466,9469,9696,9698,9702,9706,9709,9730,9760,9782,9800,9807,9825,9829,9855],[2955,2956,2957,2961,2962,2966,2967,2966,2970,2966,2973,2966,2976,2966,2979,2966,2982,2966,2985,2988,2989,2966,2992,2966,2995,2966,2998,2966,3001,2966,3004,3007],"note",{},[2958,2959,2960],"strong",{},"Нові терміни у цій статті:"," ",[2963,2964,2965],"code",{},"Button",", ",[2963,2968,2969],{},"RepeatButton",[2963,2971,2972],{},"ToggleButton",[2963,2974,2975],{},"Image",[2963,2977,2978],{},"ProgressBar",[2963,2980,2981],{},"Slider",[2963,2983,2984],{},"ToolTip",[2963,2986,2987],{},"Popup",", Pack URI, ",[2963,2990,2991],{},"IsDefault",[2963,2993,2994],{},"IsCancel",[2963,2996,2997],{},"IsIndeterminate",[2963,2999,3000],{},"TickPlacement",[2963,3002,3003],{},"IsSnapToTickEnabled",[2963,3005,3006],{},"Placement",".",[3009,3010,3012],"h2",{"id":3011},"бібліотека-контролів-перший-погляд","Бібліотека контролів: перший погляд",[3014,3015,3016,3017,3020],"p",{},"Після того як ви опанували систему розташування елементів — Grid, StackPanel, DockPanel та інші панелі — і вже добре розумієте, як будується структура вікна, настав час перейти до наступного шару: ",[2958,3018,3019],{},"самих контролів",", тих інтерактивних будівельних блоків, з яких складається будь-який WPF-застосунок.",[3014,3022,3023,3024,3027,3028,3032],{},"WPF постачається з багатою бібліотекою стандартних контролів, які разюче відрізняються від того, що міг запропонувати WinForms. Причина цієї відмінності криється у фундаментальному архітектурному рішенні: у WPF ",[2958,3025,3026],{},"контрол — це поведінка, а не зовнішність",". Кнопка вміє реагувати на натискання, але те, як вона виглядає — це лише ControlTemplate, який можна замінити повністю. Цей принцип називається ",[3029,3030,3031],"em",{},"Lookless Controls"," і є одним із найпотужніших аспектів платформи (ControlTemplate і стилізацію ми детально розбиратимемо у Блоці 8).",[3014,3034,3035,3036,3039],{},"У цій статті ми зосередимось на ",[2958,3037,3038],{},"базових контролах"," — тих, що студент зустрічає у перших же своїх застосунках і без яких неможливо уявити жодну форму: кнопки у різних варіаціях, зображення, індикатори прогресу, слайдери та підказки. Ці контроли прості у використанні, але кожен із них має нюанси, які важливо розуміти, щоб не наштовхуватись на несподівані проблеми пізніше.",[3041,3042,3043,3044,3047],"tip",{},"Контроли у WPF та Avalonia здебільшого ",[2958,3045,3046],{},"ідентичні"," за назвами та властивостями. Те, що ви вивчите у цій статті, майже без змін працюватиме і в Avalonia-проєкті. Саме тому для цього блоку не потрібен окремий Avalonia-companion.",[3049,3050],"hr",{},[3009,3052,3054],{"id":3053},"button-набагато-більше-ніж-кнопка","Button: набагато більше, ніж кнопка",[3056,3057,3059],"h3",{"id":3058},"основна-модель-взаємодії","Основна модель взаємодії",[3014,3061,3062,3064,3065,3068,3069,3071],{},[2963,3063,2965],{}," є, мабуть, найпершим контролом, з яким стикається будь-який розробник GUI. На перший погляд, він здається тривіальним: є кнопка, є подія ",[2963,3066,3067],{},"Click"," — що тут складного? Але WPF-реалізація ",[2963,3070,2965],{}," приховує у собі чимало деталей, які, якщо їх не знати, можуть спантеличити у найнеочікуваніший момент.",[3014,3073,3074,3075,3077],{},"Почнемо з найпростішого. Щоб відреагувати на натискання кнопки у code-behind, ми підписуємось на подію ",[2963,3076,3067],{},":",[3079,3080,3082,3250],"wpf-preview",{"title":3081},"Button: базова обробка Click",[3083,3084,3089],"pre",{"className":3085,"code":3086,"language":3087,"meta":3088,"style":3088},"language-xml shiki shiki-themes light-plus dark-plus dark-plus","\u003CStackPanel Margin=\"20\" Spacing=\"12\">\n  \u003CButton x:Name=\"greetButton\"\n          Content=\"Привітати!\"\n          Click=\"GreetButton_Click\"\n          HorizontalAlignment=\"Left\"\n          Padding=\"12,6\"/>\n  \u003CTextBlock x:Name=\"resultText\"\n             FontSize=\"16\"\n             Foreground=\"Gray\"\n             Text=\"Натисніть кнопку...\"/>\n\u003C/StackPanel>\n","xml","",[2963,3090,3091,3127,3143,3154,3165,3176,3190,3205,3216,3227,3240],{"__ignoreMap":3088},[3092,3093,3096,3100,3104,3108,3112,3116,3119,3121,3124],"span",{"class":3094,"line":3095},"line",1,[3092,3097,3099],{"class":3098},"s0P7L","\u003C",[3092,3101,3103],{"class":3102},"sKtos","StackPanel",[3092,3105,3107],{"class":3106},"sa4r_"," Margin",[3092,3109,3111],{"class":3110},"sHH4Y","=",[3092,3113,3115],{"class":3114},"su9tN","\"20\"",[3092,3117,3118],{"class":3106}," Spacing",[3092,3120,3111],{"class":3110},[3092,3122,3123],{"class":3114},"\"12\"",[3092,3125,3126],{"class":3098},">\n",[3092,3128,3130,3133,3135,3138,3140],{"class":3094,"line":3129},2,[3092,3131,3132],{"class":3098},"  \u003C",[3092,3134,2965],{"class":3102},[3092,3136,3137],{"class":3106}," x:Name",[3092,3139,3111],{"class":3110},[3092,3141,3142],{"class":3114},"\"greetButton\"\n",[3092,3144,3146,3149,3151],{"class":3094,"line":3145},3,[3092,3147,3148],{"class":3106},"          Content",[3092,3150,3111],{"class":3110},[3092,3152,3153],{"class":3114},"\"Привітати!\"\n",[3092,3155,3157,3160,3162],{"class":3094,"line":3156},4,[3092,3158,3159],{"class":3106},"          Click",[3092,3161,3111],{"class":3110},[3092,3163,3164],{"class":3114},"\"GreetButton_Click\"\n",[3092,3166,3168,3171,3173],{"class":3094,"line":3167},5,[3092,3169,3170],{"class":3106},"          HorizontalAlignment",[3092,3172,3111],{"class":3110},[3092,3174,3175],{"class":3114},"\"Left\"\n",[3092,3177,3179,3182,3184,3187],{"class":3094,"line":3178},6,[3092,3180,3181],{"class":3106},"          Padding",[3092,3183,3111],{"class":3110},[3092,3185,3186],{"class":3114},"\"12,6\"",[3092,3188,3189],{"class":3098},"/>\n",[3092,3191,3193,3195,3198,3200,3202],{"class":3094,"line":3192},7,[3092,3194,3132],{"class":3098},[3092,3196,3197],{"class":3102},"TextBlock",[3092,3199,3137],{"class":3106},[3092,3201,3111],{"class":3110},[3092,3203,3204],{"class":3114},"\"resultText\"\n",[3092,3206,3208,3211,3213],{"class":3094,"line":3207},8,[3092,3209,3210],{"class":3106},"             FontSize",[3092,3212,3111],{"class":3110},[3092,3214,3215],{"class":3114},"\"16\"\n",[3092,3217,3219,3222,3224],{"class":3094,"line":3218},9,[3092,3220,3221],{"class":3106},"             Foreground",[3092,3223,3111],{"class":3110},[3092,3225,3226],{"class":3114},"\"Gray\"\n",[3092,3228,3230,3233,3235,3238],{"class":3094,"line":3229},10,[3092,3231,3232],{"class":3106},"             Text",[3092,3234,3111],{"class":3110},[3092,3236,3237],{"class":3114},"\"Натисніть кнопку...\"",[3092,3239,3189],{"class":3098},[3092,3241,3243,3246,3248],{"class":3094,"line":3242},11,[3092,3244,3245],{"class":3098},"\u003C/",[3092,3247,3103],{"class":3102},[3092,3249,3126],{"class":3098},[3083,3251,3255],{"className":3252,"code":3253,"language":3254,"meta":3088,"style":3088},"language-csharp shiki shiki-themes light-plus dark-plus dark-plus","public partial class MainWindow : Window\n{\n    public MainWindow()\n    {\n        InitializeComponent();\n    }\n\n    private void GreetButton_Click(object sender, RoutedEventArgs e)\n    {\n        resultText.Text = \"Привіт, WPF! Кнопку натиснуто.\";\n    }\n}\n","csharp",[2963,3256,3257,3279,3284,3295,3300,3308,3313,3319,3351,3355,3375,3379],{"__ignoreMap":3088},[3092,3258,3259,3263,3266,3269,3273,3276],{"class":3094,"line":3095},[3092,3260,3262],{"class":3261},"su1O8","public",[3092,3264,3265],{"class":3261}," partial",[3092,3267,3268],{"class":3261}," class",[3092,3270,3272],{"class":3271},"sN1BT"," MainWindow",[3092,3274,3275],{"class":3110}," : ",[3092,3277,3278],{"class":3271},"Window\n",[3092,3280,3281],{"class":3094,"line":3129},[3092,3282,3283],{"class":3110},"{\n",[3092,3285,3286,3289,3292],{"class":3094,"line":3145},[3092,3287,3288],{"class":3261},"    public",[3092,3290,3272],{"class":3291},"s8Opu",[3092,3293,3294],{"class":3110},"()\n",[3092,3296,3297],{"class":3094,"line":3156},[3092,3298,3299],{"class":3110},"    {\n",[3092,3301,3302,3305],{"class":3094,"line":3167},[3092,3303,3304],{"class":3291},"        InitializeComponent",[3092,3306,3307],{"class":3110},"();\n",[3092,3309,3310],{"class":3094,"line":3178},[3092,3311,3312],{"class":3110},"    }\n",[3092,3314,3315],{"class":3094,"line":3192},[3092,3316,3318],{"emptyLinePlaceholder":3317},true,"\n",[3092,3320,3321,3324,3327,3330,3333,3336,3340,3342,3345,3348],{"class":3094,"line":3207},[3092,3322,3323],{"class":3261},"    private",[3092,3325,3326],{"class":3261}," void",[3092,3328,3329],{"class":3291}," GreetButton_Click",[3092,3331,3332],{"class":3110},"(",[3092,3334,3335],{"class":3261},"object",[3092,3337,3339],{"class":3338},"siwwj"," sender",[3092,3341,2966],{"class":3110},[3092,3343,3344],{"class":3271},"RoutedEventArgs",[3092,3346,3347],{"class":3338}," e",[3092,3349,3350],{"class":3110},")\n",[3092,3352,3353],{"class":3094,"line":3218},[3092,3354,3299],{"class":3110},[3092,3356,3357,3360,3362,3365,3368,3372],{"class":3094,"line":3229},[3092,3358,3359],{"class":3338},"        resultText",[3092,3361,3007],{"class":3110},[3092,3363,3364],{"class":3338},"Text",[3092,3366,3367],{"class":3110}," = ",[3092,3369,3371],{"class":3370},"sbdoH","\"Привіт, WPF! Кнопку натиснуто.\"",[3092,3373,3374],{"class":3110},";\n",[3092,3376,3377],{"class":3094,"line":3242},[3092,3378,3312],{"class":3110},[3092,3380,3382],{"class":3094,"line":3381},12,[3092,3383,3384],{"class":3110},"}\n",[3014,3386,3387,3388,3391,3392,3394,3395,3397,3398,3400,3401,3404,3405,3407,3408,3411],{},"Зверніть увагу на сигнатуру обробника: ",[2963,3389,3390],{},"sender"," — це об'єкт, що ініціював подію (у цьому випадку сам ",[2963,3393,2965],{},"), а ",[2963,3396,3344],{}," — аргументи маршрутизованої події. Клас ",[2963,3399,3344],{}," містить властивість ",[2963,3402,3403],{},"Handled",", яка дозволяє зупинити подальше поширення події по дереву елементів. Систему маршрутизованих подій ми детально розглянемо у статті про Routed Events, але вже зараз важливо знати, що ",[2963,3406,3067],{}," — це ",[2958,3409,3410],{},"bubbling event",": він починається у тому елементі, на якому відбувся клік, і \"спливає\" вгору по дереву до кореня.",[3056,3413,3415],{"id":3414},"isdefault-та-iscancel-клавіатурна-взаємодія","IsDefault та IsCancel: клавіатурна взаємодія",[3014,3417,3418,3419,3421],{},"Оскільки WPF орієнтований на створення повноцінних настільних застосунків, надзвичайно важливою є підтримка клавіатурної навігації. Дві властивості ",[2963,3420,2965],{}," безпосередньо пов'язані з цим:",[3014,3423,3424,3428,3429,3432,3433,3437,3438,3441,3442,3445],{},[2958,3425,3426],{},[2963,3427,2991],{}," — коли встановлено в ",[2963,3430,3431],{},"true",", кнопка автоматично спрацьовує при натисканні ",[3434,3435],"kbd",{"value":3436},"Enter",", незалежно від того, який елемент має фокус у цей момент (за умови, що поточний елемент не перехоплює Enter для власних потреб, як це робить, наприклад, ",[2963,3439,3440],{},"TextBox"," з ",[2963,3443,3444],{},"AcceptsReturn=\"True\"","). Таку кнопку прийнято малювати з потовщеною рамкою — це стандартна UX-конвенція, яка сигналізує користувачу: \"Enter виконає саме цю дію\".",[3014,3447,3448,3452,3453,3456,3457,3460,3461,3464,3465,3007],{},[2958,3449,3450],{},[2963,3451,2994],{}," — аналогічно, але для клавіші ",[3434,3454],{"value":3455},"Escape",". Кнопка \"Скасувати\" у діалогових вікнах майже завжди матиме ",[2963,3458,3459],{},"IsCancel=\"True\"",". Крім того, якщо вікно відкрито через метод ",[2963,3462,3463],{},"ShowDialog()",", натискання цієї кнопки автоматично закриває діалог зі значенням ",[2963,3466,3467],{},"DialogResult = false",[3079,3469,3471],{"title":3470},"IsDefault та IsCancel у формі",[3083,3472,3474],{"className":3085,"code":3473,"language":3087,"meta":3088,"style":3088},"\u003CStackPanel Margin=\"20\" Spacing=\"12\">\n  \u003CTextBlock Text=\"Заповніть форму та натисніть Enter або Escape:\"\n             Foreground=\"Gray\"/>\n  \u003CTextBox Width=\"240\" HorizontalAlignment=\"Left\" Padding=\"8,4\"/>\n  \u003CStackPanel Orientation=\"Horizontal\" Spacing=\"8\">\n    \u003CButton Content=\"✔ Підтвердити\"\n            IsDefault=\"True\"\n            Padding=\"12,6\"\n            Command=\"{Binding ShowMessageCommand}\"\n            CommandParameter=\"Форму підтверджено (Enter або клік)!\"/>\n    \u003CButton Content=\"✖ Скасувати\"\n            IsCancel=\"True\"\n            Padding=\"12,6\"\n            Command=\"{Binding ShowMessageCommand}\"\n            CommandParameter=\"Скасовано (Escape або клік).\"/>\n  \u003C/StackPanel>\n\u003C/StackPanel>\n",[2963,3475,3476,3496,3510,3521,3553,3576,3591,3601,3611,3621,3633,3646,3655,3664,3673,3685,3695],{"__ignoreMap":3088},[3092,3477,3478,3480,3482,3484,3486,3488,3490,3492,3494],{"class":3094,"line":3095},[3092,3479,3099],{"class":3098},[3092,3481,3103],{"class":3102},[3092,3483,3107],{"class":3106},[3092,3485,3111],{"class":3110},[3092,3487,3115],{"class":3114},[3092,3489,3118],{"class":3106},[3092,3491,3111],{"class":3110},[3092,3493,3123],{"class":3114},[3092,3495,3126],{"class":3098},[3092,3497,3498,3500,3502,3505,3507],{"class":3094,"line":3129},[3092,3499,3132],{"class":3098},[3092,3501,3197],{"class":3102},[3092,3503,3504],{"class":3106}," Text",[3092,3506,3111],{"class":3110},[3092,3508,3509],{"class":3114},"\"Заповніть форму та натисніть Enter або Escape:\"\n",[3092,3511,3512,3514,3516,3519],{"class":3094,"line":3145},[3092,3513,3221],{"class":3106},[3092,3515,3111],{"class":3110},[3092,3517,3518],{"class":3114},"\"Gray\"",[3092,3520,3189],{"class":3098},[3092,3522,3523,3525,3527,3530,3532,3535,3538,3540,3543,3546,3548,3551],{"class":3094,"line":3156},[3092,3524,3132],{"class":3098},[3092,3526,3440],{"class":3102},[3092,3528,3529],{"class":3106}," Width",[3092,3531,3111],{"class":3110},[3092,3533,3534],{"class":3114},"\"240\"",[3092,3536,3537],{"class":3106}," HorizontalAlignment",[3092,3539,3111],{"class":3110},[3092,3541,3542],{"class":3114},"\"Left\"",[3092,3544,3545],{"class":3106}," Padding",[3092,3547,3111],{"class":3110},[3092,3549,3550],{"class":3114},"\"8,4\"",[3092,3552,3189],{"class":3098},[3092,3554,3555,3557,3559,3562,3564,3567,3569,3571,3574],{"class":3094,"line":3167},[3092,3556,3132],{"class":3098},[3092,3558,3103],{"class":3102},[3092,3560,3561],{"class":3106}," Orientation",[3092,3563,3111],{"class":3110},[3092,3565,3566],{"class":3114},"\"Horizontal\"",[3092,3568,3118],{"class":3106},[3092,3570,3111],{"class":3110},[3092,3572,3573],{"class":3114},"\"8\"",[3092,3575,3126],{"class":3098},[3092,3577,3578,3581,3583,3586,3588],{"class":3094,"line":3178},[3092,3579,3580],{"class":3098},"    \u003C",[3092,3582,2965],{"class":3102},[3092,3584,3585],{"class":3106}," Content",[3092,3587,3111],{"class":3110},[3092,3589,3590],{"class":3114},"\"✔ Підтвердити\"\n",[3092,3592,3593,3596,3598],{"class":3094,"line":3192},[3092,3594,3595],{"class":3106},"            IsDefault",[3092,3597,3111],{"class":3110},[3092,3599,3600],{"class":3114},"\"True\"\n",[3092,3602,3603,3606,3608],{"class":3094,"line":3207},[3092,3604,3605],{"class":3106},"            Padding",[3092,3607,3111],{"class":3110},[3092,3609,3610],{"class":3114},"\"12,6\"\n",[3092,3612,3613,3616,3618],{"class":3094,"line":3218},[3092,3614,3615],{"class":3106},"            Command",[3092,3617,3111],{"class":3110},[3092,3619,3620],{"class":3114},"\"{Binding ShowMessageCommand}\"\n",[3092,3622,3623,3626,3628,3631],{"class":3094,"line":3229},[3092,3624,3625],{"class":3106},"            CommandParameter",[3092,3627,3111],{"class":3110},[3092,3629,3630],{"class":3114},"\"Форму підтверджено (Enter або клік)!\"",[3092,3632,3189],{"class":3098},[3092,3634,3635,3637,3639,3641,3643],{"class":3094,"line":3242},[3092,3636,3580],{"class":3098},[3092,3638,2965],{"class":3102},[3092,3640,3585],{"class":3106},[3092,3642,3111],{"class":3110},[3092,3644,3645],{"class":3114},"\"✖ Скасувати\"\n",[3092,3647,3648,3651,3653],{"class":3094,"line":3381},[3092,3649,3650],{"class":3106},"            IsCancel",[3092,3652,3111],{"class":3110},[3092,3654,3600],{"class":3114},[3092,3656,3658,3660,3662],{"class":3094,"line":3657},13,[3092,3659,3605],{"class":3106},[3092,3661,3111],{"class":3110},[3092,3663,3610],{"class":3114},[3092,3665,3667,3669,3671],{"class":3094,"line":3666},14,[3092,3668,3615],{"class":3106},[3092,3670,3111],{"class":3110},[3092,3672,3620],{"class":3114},[3092,3674,3676,3678,3680,3683],{"class":3094,"line":3675},15,[3092,3677,3625],{"class":3106},[3092,3679,3111],{"class":3110},[3092,3681,3682],{"class":3114},"\"Скасовано (Escape або клік).\"",[3092,3684,3189],{"class":3098},[3092,3686,3688,3691,3693],{"class":3094,"line":3687},16,[3092,3689,3690],{"class":3098},"  \u003C/",[3092,3692,3103],{"class":3102},[3092,3694,3126],{"class":3098},[3092,3696,3698,3700,3702],{"class":3094,"line":3697},17,[3092,3699,3245],{"class":3098},[3092,3701,3103],{"class":3102},[3092,3703,3126],{"class":3098},[3056,3705,3707],{"id":3706},"content-не-лише-текст","Content — не лише текст",[3014,3709,3710,3711,3713,3714,3717,3718,3721,3722,3724,3725,3728,3729,3731,3732,3734,3735,3738,3739,3007],{},"Одна з найважливіших відмінностей між ",[2963,3712,2965],{}," у WPF і кнопкою у WinForms полягає у тому, що властивість ",[2963,3715,3716],{},"Content"," у WPF може містити ",[2958,3719,3720],{},"будь-який об'єкт"," — рядок, число, зображення, цілу панель із вкладеними елементами. Це стає можливим завдяки тому, що ",[2963,3723,2965],{}," успадковує від ",[2963,3726,3727],{},"ContentControl",", а ",[2963,3730,3727],{}," відображає своє ",[2963,3733,3716],{}," через ",[2963,3736,3737],{},"DataTemplate"," або напряму, якщо вміст вже є ",[2963,3740,3741],{},"UIElement",[3014,3743,3744,3745,3748,3749,3077],{},"Найпоширеніший практичний приклад — кнопка з іконкою та текстом. У WinForms це потребувало спеціального ",[2963,3746,3747],{},"ImageButton","-компонента або хакерських рішень. У WPF — це просто кілька вкладених елементів усередині ",[2963,3750,3751],{},"Button.Content",[3079,3753,3755],{"title":3754},"Button: іконка + текст всередині",[3083,3756,3758],{"className":3085,"code":3757,"language":3087,"meta":3088,"style":3088},"\u003CStackPanel Margin=\"20\" Spacing=\"12\">\n  \u003CButton HorizontalAlignment=\"Left\" Padding=\"12,8\">\n    \u003CStackPanel Orientation=\"Horizontal\" Spacing=\"8\">\n      \u003CTextBlock Text=\"💾\" FontSize=\"18\" VerticalAlignment=\"Center\"/>\n      \u003CTextBlock Text=\"Зберегти файл\"\n                 FontSize=\"14\"\n                 VerticalAlignment=\"Center\"/>\n    \u003C/StackPanel>\n  \u003C/Button>\n  \u003CButton HorizontalAlignment=\"Left\" Padding=\"12,8\">\n    \u003CStackPanel Orientation=\"Horizontal\" Spacing=\"8\">\n      \u003CEllipse Width=\"12\" Height=\"12\"\n               Fill=\"LimeGreen\"\n               VerticalAlignment=\"Center\"/>\n      \u003CTextBlock Text=\"З'єднати\"\n                 FontSize=\"14\"\n                 VerticalAlignment=\"Center\"/>\n    \u003C/StackPanel>\n  \u003C/Button>\n\u003C/StackPanel>\n",[2963,3759,3760,3780,3801,3821,3853,3866,3876,3887,3896,3904,3924,3944,3965,3975,3986,3999,4007,4017,4026,4035],{"__ignoreMap":3088},[3092,3761,3762,3764,3766,3768,3770,3772,3774,3776,3778],{"class":3094,"line":3095},[3092,3763,3099],{"class":3098},[3092,3765,3103],{"class":3102},[3092,3767,3107],{"class":3106},[3092,3769,3111],{"class":3110},[3092,3771,3115],{"class":3114},[3092,3773,3118],{"class":3106},[3092,3775,3111],{"class":3110},[3092,3777,3123],{"class":3114},[3092,3779,3126],{"class":3098},[3092,3781,3782,3784,3786,3788,3790,3792,3794,3796,3799],{"class":3094,"line":3129},[3092,3783,3132],{"class":3098},[3092,3785,2965],{"class":3102},[3092,3787,3537],{"class":3106},[3092,3789,3111],{"class":3110},[3092,3791,3542],{"class":3114},[3092,3793,3545],{"class":3106},[3092,3795,3111],{"class":3110},[3092,3797,3798],{"class":3114},"\"12,8\"",[3092,3800,3126],{"class":3098},[3092,3802,3803,3805,3807,3809,3811,3813,3815,3817,3819],{"class":3094,"line":3145},[3092,3804,3580],{"class":3098},[3092,3806,3103],{"class":3102},[3092,3808,3561],{"class":3106},[3092,3810,3111],{"class":3110},[3092,3812,3566],{"class":3114},[3092,3814,3118],{"class":3106},[3092,3816,3111],{"class":3110},[3092,3818,3573],{"class":3114},[3092,3820,3126],{"class":3098},[3092,3822,3823,3826,3828,3830,3832,3835,3838,3840,3843,3846,3848,3851],{"class":3094,"line":3156},[3092,3824,3825],{"class":3098},"      \u003C",[3092,3827,3197],{"class":3102},[3092,3829,3504],{"class":3106},[3092,3831,3111],{"class":3110},[3092,3833,3834],{"class":3114},"\"💾\"",[3092,3836,3837],{"class":3106}," FontSize",[3092,3839,3111],{"class":3110},[3092,3841,3842],{"class":3114},"\"18\"",[3092,3844,3845],{"class":3106}," VerticalAlignment",[3092,3847,3111],{"class":3110},[3092,3849,3850],{"class":3114},"\"Center\"",[3092,3852,3189],{"class":3098},[3092,3854,3855,3857,3859,3861,3863],{"class":3094,"line":3167},[3092,3856,3825],{"class":3098},[3092,3858,3197],{"class":3102},[3092,3860,3504],{"class":3106},[3092,3862,3111],{"class":3110},[3092,3864,3865],{"class":3114},"\"Зберегти файл\"\n",[3092,3867,3868,3871,3873],{"class":3094,"line":3178},[3092,3869,3870],{"class":3106},"                 FontSize",[3092,3872,3111],{"class":3110},[3092,3874,3875],{"class":3114},"\"14\"\n",[3092,3877,3878,3881,3883,3885],{"class":3094,"line":3192},[3092,3879,3880],{"class":3106},"                 VerticalAlignment",[3092,3882,3111],{"class":3110},[3092,3884,3850],{"class":3114},[3092,3886,3189],{"class":3098},[3092,3888,3889,3892,3894],{"class":3094,"line":3207},[3092,3890,3891],{"class":3098},"    \u003C/",[3092,3893,3103],{"class":3102},[3092,3895,3126],{"class":3098},[3092,3897,3898,3900,3902],{"class":3094,"line":3218},[3092,3899,3690],{"class":3098},[3092,3901,2965],{"class":3102},[3092,3903,3126],{"class":3098},[3092,3905,3906,3908,3910,3912,3914,3916,3918,3920,3922],{"class":3094,"line":3229},[3092,3907,3132],{"class":3098},[3092,3909,2965],{"class":3102},[3092,3911,3537],{"class":3106},[3092,3913,3111],{"class":3110},[3092,3915,3542],{"class":3114},[3092,3917,3545],{"class":3106},[3092,3919,3111],{"class":3110},[3092,3921,3798],{"class":3114},[3092,3923,3126],{"class":3098},[3092,3925,3926,3928,3930,3932,3934,3936,3938,3940,3942],{"class":3094,"line":3242},[3092,3927,3580],{"class":3098},[3092,3929,3103],{"class":3102},[3092,3931,3561],{"class":3106},[3092,3933,3111],{"class":3110},[3092,3935,3566],{"class":3114},[3092,3937,3118],{"class":3106},[3092,3939,3111],{"class":3110},[3092,3941,3573],{"class":3114},[3092,3943,3126],{"class":3098},[3092,3945,3946,3948,3951,3953,3955,3957,3960,3962],{"class":3094,"line":3381},[3092,3947,3825],{"class":3098},[3092,3949,3950],{"class":3102},"Ellipse",[3092,3952,3529],{"class":3106},[3092,3954,3111],{"class":3110},[3092,3956,3123],{"class":3114},[3092,3958,3959],{"class":3106}," Height",[3092,3961,3111],{"class":3110},[3092,3963,3964],{"class":3114},"\"12\"\n",[3092,3966,3967,3970,3972],{"class":3094,"line":3657},[3092,3968,3969],{"class":3106},"               Fill",[3092,3971,3111],{"class":3110},[3092,3973,3974],{"class":3114},"\"LimeGreen\"\n",[3092,3976,3977,3980,3982,3984],{"class":3094,"line":3666},[3092,3978,3979],{"class":3106},"               VerticalAlignment",[3092,3981,3111],{"class":3110},[3092,3983,3850],{"class":3114},[3092,3985,3189],{"class":3098},[3092,3987,3988,3990,3992,3994,3996],{"class":3094,"line":3675},[3092,3989,3825],{"class":3098},[3092,3991,3197],{"class":3102},[3092,3993,3504],{"class":3106},[3092,3995,3111],{"class":3110},[3092,3997,3998],{"class":3114},"\"З'єднати\"\n",[3092,4000,4001,4003,4005],{"class":3094,"line":3687},[3092,4002,3870],{"class":3106},[3092,4004,3111],{"class":3110},[3092,4006,3875],{"class":3114},[3092,4008,4009,4011,4013,4015],{"class":3094,"line":3697},[3092,4010,3880],{"class":3106},[3092,4012,3111],{"class":3110},[3092,4014,3850],{"class":3114},[3092,4016,3189],{"class":3098},[3092,4018,4020,4022,4024],{"class":3094,"line":4019},18,[3092,4021,3891],{"class":3098},[3092,4023,3103],{"class":3102},[3092,4025,3126],{"class":3098},[3092,4027,4029,4031,4033],{"class":3094,"line":4028},19,[3092,4030,3690],{"class":3098},[3092,4032,2965],{"class":3102},[3092,4034,3126],{"class":3098},[3092,4036,4038,4040,4042],{"class":3094,"line":4037},20,[3092,4039,3245],{"class":3098},[3092,4041,3103],{"class":3102},[3092,4043,3126],{"class":3098},[2955,4045,4046,4047,4050,4051,4054,4055,4057,4058,4061,4062,4064,4065,4068,4069,4071,4072,4074],{},"Між тегами ",[2963,4048,4049],{},"\u003CButton>"," і ",[2963,4052,4053],{},"\u003C/Button>"," ми розмістили ",[2963,4056,3103],{},", а не ",[2963,4059,4060],{},"Content=\"...\""," у вигляді атрибуту. Це можливо завдяки тому, що ",[2963,4063,3716],{}," є ",[3029,4066,4067],{},"Content Property"," для ",[2963,4070,3727],{}," — найперший прямий дочірній елемент у XAML автоматично стає значенням ",[2963,4073,3716],{},". Докладніше про Content Property ми говорили у статті про XAML.",[3014,4076,4077,4078,4081,4082,4085,4086,4089,4090,4093,4094,4096,4097,4099,4100,4102,4103,4106],{},"Важлива деталь: у XAML можна написати ",[2963,4079,4080],{},"Content=\"Натисни\"",", якщо вміст — рядок, але написати ",[2963,4083,4084],{},"Content=\"\u003CStackPanel>...\""," у вигляді атрибута неможливо — значення атрибута є рядком. Для складного вмісту ми або використовуємо дочірній елемент, або ",[2963,4087,4088],{},"\u003CButton.Content>"," (Property Element Syntax). Також варто знати про ",[2963,4091,4092],{},"Command"," як альтернативу ",[2963,4095,3067],{},": замість обробника події у code-behind, ",[2963,4098,2965],{}," підтримує властивість ",[2963,4101,4092],{},", яка приймає реалізацію ",[2963,4104,4105],{},"ICommand",". Це основний механізм у MVVM-архітектурі, і ми повернемося до нього детально у Блоці 7. Поки достатньо знати, що він існує.",[3049,4108],{},[3009,4110,4112],{"id":4111},"repeatbutton-кнопка-що-тисне-безупинно","RepeatButton: кнопка, що \"тисне\" безупинно",[3056,4114,4116],{"id":4115},"коли-одного-кліку-недостатньо","Коли одного кліку недостатньо",[3014,4118,4119,4121,4122,4125,4126,4128,4129,4134],{},[2963,4120,2969],{}," — це спеціалізований нащадок ",[2963,4123,4124],{},"ButtonBase",", поведінка якого відрізняється від звичайного ",[2963,4127,2965],{}," в одному принциповому аспекті: поки користувач утримує кнопку миші натисненою, контрол ",[2958,4130,4131,4132],{},"безперервно генерує події ",[2963,4133,3067],{}," через рівні інтервали часу. Це робить його ідеальним для сценаріїв, де логічно \"прокручувати\" значення, поки натиснуто: кнопки збільшення/зменшення числового поля, кнопки ручної прокрутки у кастомних скролбарах тощо.",[3014,4136,4137],{},"Дві ключові властивості керують цією поведінкою:",[4139,4140,4141,4151],"field-group",{},[4142,4143,4146,4147,4150],"field",{"name":4144,"type":4145},"Delay","int","Час у мілісекундах між першим натисканням та початком повторення. За замовчуванням — ",[2963,4148,4149],{},"250",". Це \"захист\" від випадкових подвійних спрацьовувань — короткий клік не викличе жодного повторення.",[4142,4152,4154,4155,4157,4158,4160],{"name":4153,"type":4145},"Interval","Час у мілісекундах між повторними ",[2963,4156,3067],{},"-подіями у \"безперервному режимі\". За замовчуванням — ",[2963,4159,4149],{},". Чим менше значення — тим швидше відбуваються повтори.",[3079,4162,4164],{"title":4163},"RepeatButton: кнопки збільшення та зменшення",[3083,4165,4167],{"className":3085,"code":4166,"language":3087,"meta":3088,"style":3088},"\u003CStackPanel Margin=\"20\" Spacing=\"16\" HorizontalAlignment=\"Left\">\n  \u003CTextBlock Text=\"Утримуйте кнопки — вони генерують Click безперервно.\"\n             Foreground=\"Gray\" FontSize=\"12\"/>\n  \u003CStackPanel Orientation=\"Horizontal\" Spacing=\"8\" HorizontalAlignment=\"Left\">\n    \u003CRepeatButton Content=\"▼\"\n                  Delay=\"300\"\n                  Interval=\"80\"\n                  Width=\"48\" Height=\"36\"\n                  FontSize=\"18\"\n                  Command=\"{Binding ShowMessageCommand}\"\n                  CommandParameter=\"Зменшити!\"/>\n    \u003CTextBlock Text=\"42\"\n               FontSize=\"32\" FontWeight=\"Bold\"\n               VerticalAlignment=\"Center\"\n               MinWidth=\"60\"\n               TextAlignment=\"Center\"/>\n    \u003CRepeatButton Content=\"▲\"\n                  Delay=\"300\"\n                  Interval=\"80\"\n                  Width=\"48\" Height=\"36\"\n                  FontSize=\"18\"\n                  Command=\"{Binding ShowMessageCommand}\"\n                  CommandParameter=\"Збільшити!\"/>\n  \u003C/StackPanel>\n\u003C/StackPanel>\n",[2963,4168,4169,4196,4209,4225,4251,4264,4274,4284,4301,4311,4320,4332,4345,4363,4372,4382,4393,4406,4414,4422,4436,4445,4454,4466,4475],{"__ignoreMap":3088},[3092,4170,4171,4173,4175,4177,4179,4181,4183,4185,4188,4190,4192,4194],{"class":3094,"line":3095},[3092,4172,3099],{"class":3098},[3092,4174,3103],{"class":3102},[3092,4176,3107],{"class":3106},[3092,4178,3111],{"class":3110},[3092,4180,3115],{"class":3114},[3092,4182,3118],{"class":3106},[3092,4184,3111],{"class":3110},[3092,4186,4187],{"class":3114},"\"16\"",[3092,4189,3537],{"class":3106},[3092,4191,3111],{"class":3110},[3092,4193,3542],{"class":3114},[3092,4195,3126],{"class":3098},[3092,4197,4198,4200,4202,4204,4206],{"class":3094,"line":3129},[3092,4199,3132],{"class":3098},[3092,4201,3197],{"class":3102},[3092,4203,3504],{"class":3106},[3092,4205,3111],{"class":3110},[3092,4207,4208],{"class":3114},"\"Утримуйте кнопки — вони генерують Click безперервно.\"\n",[3092,4210,4211,4213,4215,4217,4219,4221,4223],{"class":3094,"line":3145},[3092,4212,3221],{"class":3106},[3092,4214,3111],{"class":3110},[3092,4216,3518],{"class":3114},[3092,4218,3837],{"class":3106},[3092,4220,3111],{"class":3110},[3092,4222,3123],{"class":3114},[3092,4224,3189],{"class":3098},[3092,4226,4227,4229,4231,4233,4235,4237,4239,4241,4243,4245,4247,4249],{"class":3094,"line":3156},[3092,4228,3132],{"class":3098},[3092,4230,3103],{"class":3102},[3092,4232,3561],{"class":3106},[3092,4234,3111],{"class":3110},[3092,4236,3566],{"class":3114},[3092,4238,3118],{"class":3106},[3092,4240,3111],{"class":3110},[3092,4242,3573],{"class":3114},[3092,4244,3537],{"class":3106},[3092,4246,3111],{"class":3110},[3092,4248,3542],{"class":3114},[3092,4250,3126],{"class":3098},[3092,4252,4253,4255,4257,4259,4261],{"class":3094,"line":3167},[3092,4254,3580],{"class":3098},[3092,4256,2969],{"class":3102},[3092,4258,3585],{"class":3106},[3092,4260,3111],{"class":3110},[3092,4262,4263],{"class":3114},"\"▼\"\n",[3092,4265,4266,4269,4271],{"class":3094,"line":3178},[3092,4267,4268],{"class":3106},"                  Delay",[3092,4270,3111],{"class":3110},[3092,4272,4273],{"class":3114},"\"300\"\n",[3092,4275,4276,4279,4281],{"class":3094,"line":3192},[3092,4277,4278],{"class":3106},"                  Interval",[3092,4280,3111],{"class":3110},[3092,4282,4283],{"class":3114},"\"80\"\n",[3092,4285,4286,4289,4291,4294,4296,4298],{"class":3094,"line":3207},[3092,4287,4288],{"class":3106},"                  Width",[3092,4290,3111],{"class":3110},[3092,4292,4293],{"class":3114},"\"48\"",[3092,4295,3959],{"class":3106},[3092,4297,3111],{"class":3110},[3092,4299,4300],{"class":3114},"\"36\"\n",[3092,4302,4303,4306,4308],{"class":3094,"line":3218},[3092,4304,4305],{"class":3106},"                  FontSize",[3092,4307,3111],{"class":3110},[3092,4309,4310],{"class":3114},"\"18\"\n",[3092,4312,4313,4316,4318],{"class":3094,"line":3229},[3092,4314,4315],{"class":3106},"                  Command",[3092,4317,3111],{"class":3110},[3092,4319,3620],{"class":3114},[3092,4321,4322,4325,4327,4330],{"class":3094,"line":3242},[3092,4323,4324],{"class":3106},"                  CommandParameter",[3092,4326,3111],{"class":3110},[3092,4328,4329],{"class":3114},"\"Зменшити!\"",[3092,4331,3189],{"class":3098},[3092,4333,4334,4336,4338,4340,4342],{"class":3094,"line":3381},[3092,4335,3580],{"class":3098},[3092,4337,3197],{"class":3102},[3092,4339,3504],{"class":3106},[3092,4341,3111],{"class":3110},[3092,4343,4344],{"class":3114},"\"42\"\n",[3092,4346,4347,4350,4352,4355,4358,4360],{"class":3094,"line":3657},[3092,4348,4349],{"class":3106},"               FontSize",[3092,4351,3111],{"class":3110},[3092,4353,4354],{"class":3114},"\"32\"",[3092,4356,4357],{"class":3106}," FontWeight",[3092,4359,3111],{"class":3110},[3092,4361,4362],{"class":3114},"\"Bold\"\n",[3092,4364,4365,4367,4369],{"class":3094,"line":3666},[3092,4366,3979],{"class":3106},[3092,4368,3111],{"class":3110},[3092,4370,4371],{"class":3114},"\"Center\"\n",[3092,4373,4374,4377,4379],{"class":3094,"line":3675},[3092,4375,4376],{"class":3106},"               MinWidth",[3092,4378,3111],{"class":3110},[3092,4380,4381],{"class":3114},"\"60\"\n",[3092,4383,4384,4387,4389,4391],{"class":3094,"line":3687},[3092,4385,4386],{"class":3106},"               TextAlignment",[3092,4388,3111],{"class":3110},[3092,4390,3850],{"class":3114},[3092,4392,3189],{"class":3098},[3092,4394,4395,4397,4399,4401,4403],{"class":3094,"line":3697},[3092,4396,3580],{"class":3098},[3092,4398,2969],{"class":3102},[3092,4400,3585],{"class":3106},[3092,4402,3111],{"class":3110},[3092,4404,4405],{"class":3114},"\"▲\"\n",[3092,4407,4408,4410,4412],{"class":3094,"line":4019},[3092,4409,4268],{"class":3106},[3092,4411,3111],{"class":3110},[3092,4413,4273],{"class":3114},[3092,4415,4416,4418,4420],{"class":3094,"line":4028},[3092,4417,4278],{"class":3106},[3092,4419,3111],{"class":3110},[3092,4421,4283],{"class":3114},[3092,4423,4424,4426,4428,4430,4432,4434],{"class":3094,"line":4037},[3092,4425,4288],{"class":3106},[3092,4427,3111],{"class":3110},[3092,4429,4293],{"class":3114},[3092,4431,3959],{"class":3106},[3092,4433,3111],{"class":3110},[3092,4435,4300],{"class":3114},[3092,4437,4439,4441,4443],{"class":3094,"line":4438},21,[3092,4440,4305],{"class":3106},[3092,4442,3111],{"class":3110},[3092,4444,4310],{"class":3114},[3092,4446,4448,4450,4452],{"class":3094,"line":4447},22,[3092,4449,4315],{"class":3106},[3092,4451,3111],{"class":3110},[3092,4453,3620],{"class":3114},[3092,4455,4457,4459,4461,4464],{"class":3094,"line":4456},23,[3092,4458,4324],{"class":3106},[3092,4460,3111],{"class":3110},[3092,4462,4463],{"class":3114},"\"Збільшити!\"",[3092,4465,3189],{"class":3098},[3092,4467,4469,4471,4473],{"class":3094,"line":4468},24,[3092,4470,3690],{"class":3098},[3092,4472,3103],{"class":3102},[3092,4474,3126],{"class":3098},[3092,4476,4478,4480,4482],{"class":3094,"line":4477},25,[3092,4479,3245],{"class":3098},[3092,4481,3103],{"class":3102},[3092,4483,3126],{"class":3098},[3041,4485,4486,4488,4489,4492,4493,4495,4496,4498,4499,4502],{},[2963,4487,2969],{}," — це саме той компонент, зі якого внутрішньо побудований стандартний ",[2963,4490,4491],{},"ScrollBar",". Якщо ви колись розглядали ControlTemplate контролу ",[2963,4494,4491],{},", то знаходили там два ",[2963,4497,2969],{},"-и (для прокрутки вгору та вниз) та ",[2963,4500,4501],{},"Thumb"," (перетягувальний повзунок). Тепер ви знаєте будівельний матеріал, з якого зроблені ці повсякденні UI-елементи.",[3049,4504],{},[3009,4506,4508],{"id":4507},"togglebutton-кнопка-з-памяттю","ToggleButton: кнопка з пам'яттю",[3056,4510,4512],{"id":4511},"три-стани-замість-двох","Три стани замість двох",[3014,4514,4515,4517,4518,4520,4521,4523,4524,3407,4526,4529,4530,3007],{},[2963,4516,2972],{}," — це ще один нащадок ",[2963,4519,4124],{},", але з принципово іншою моделлю стану. Якщо звичайний ",[2963,4522,2965],{}," — це миттєвий імпульс (\"натиснули → відбулась дія\"), то ",[2963,4525,2972],{},[2958,4527,4528],{},"перемикач",", який зберігає свій стан між натисканнями. Уявіть кнопку \"Напівжирний\" у текстовому редакторі: вона або активна (текст жирний), або неактивна. Це — ",[2963,4531,2972],{},[3014,4533,4534,4535,4538,4539,4542,4543,4545,4546,3077],{},"Ключова властивість — ",[2963,4536,4537],{},"IsChecked",", яка має тип ",[2963,4540,4541],{},"bool?"," (nullable bool). Це не помилка — ",[2963,4544,2972],{}," підтримує ",[2958,4547,4548],{},"три стани",[4550,4551,4552,4570],"table",{},[4553,4554,4555],"thead",{},[4556,4557,4558,4564,4567],"tr",{},[4559,4560,4561,4562],"th",{},"Стан ",[2963,4563,4537],{},[4559,4565,4566],{},"Значення",[4559,4568,4569],{},"Відповідна подія",[4571,4572,4573,4588,4603],"tbody",{},[4556,4574,4575,4580,4583],{},[4576,4577,4578],"td",{},[2963,4579,3431],{},[4576,4581,4582],{},"Кнопку \"натиснуто\" / увімкнено",[4576,4584,4585],{},[2963,4586,4587],{},"Checked",[4556,4589,4590,4595,4598],{},[4576,4591,4592],{},[2963,4593,4594],{},"false",[4576,4596,4597],{},"Кнопку \"відпущено\" / вимкнено",[4576,4599,4600],{},[2963,4601,4602],{},"Unchecked",[4556,4604,4605,4610,4613],{},[4576,4606,4607],{},[2963,4608,4609],{},"null",[4576,4611,4612],{},"Невизначений (проміжний) стан",[4576,4614,4615],{},[2963,4616,4617],{},"Indeterminate",[3014,4619,4620,4621,4624,4625,4627,4628,4630,4631,3007],{},"Для активації тристанового режиму потрібно встановити ",[2963,4622,4623],{},"IsThreeState=\"True\"",". За замовчуванням ",[2963,4626,2972],{}," перемикається лише між ",[2963,4629,3431],{}," та ",[2963,4632,4594],{},[3079,4634,4636],{"title":4635},"ToggleButton: перемикачі різних режимів",[3083,4637,4639],{"className":3085,"code":4638,"language":3087,"meta":3088,"style":3088},"\u003CStackPanel Margin=\"20\" Spacing=\"12\" HorizontalAlignment=\"Left\">\n  \u003CTextBlock Text=\"Оберіть режим:\"\n             Foreground=\"Gray\" FontSize=\"13\"/>\n  \u003CStackPanel Orientation=\"Horizontal\" Spacing=\"8\">\n    \u003CToggleButton Content=\"🌙 Темна тема\"\n                  Padding=\"12,6\"\n                  Command=\"{Binding ShowMessageCommand}\"\n                  CommandParameter=\"Тему перемкнуто!\"/>\n    \u003CToggleButton Content=\"🔔 Сповіщення\"\n                  IsChecked=\"True\"\n                  Padding=\"12,6\"/>\n    \u003CToggleButton Content=\"📌 Закріпити\"\n                  IsThreeState=\"True\"\n                  Padding=\"12,6\"/>\n  \u003C/StackPanel>\n  \u003CTextBlock Text=\"Третя кнопка має три стани — клікайте кілька разів.\"\n             Foreground=\"Gray\" FontSize=\"12\"/>\n\u003C/StackPanel>\n",[2963,4640,4641,4667,4680,4697,4717,4730,4739,4747,4758,4771,4780,4790,4803,4812,4822,4830,4843,4859],{"__ignoreMap":3088},[3092,4642,4643,4645,4647,4649,4651,4653,4655,4657,4659,4661,4663,4665],{"class":3094,"line":3095},[3092,4644,3099],{"class":3098},[3092,4646,3103],{"class":3102},[3092,4648,3107],{"class":3106},[3092,4650,3111],{"class":3110},[3092,4652,3115],{"class":3114},[3092,4654,3118],{"class":3106},[3092,4656,3111],{"class":3110},[3092,4658,3123],{"class":3114},[3092,4660,3537],{"class":3106},[3092,4662,3111],{"class":3110},[3092,4664,3542],{"class":3114},[3092,4666,3126],{"class":3098},[3092,4668,4669,4671,4673,4675,4677],{"class":3094,"line":3129},[3092,4670,3132],{"class":3098},[3092,4672,3197],{"class":3102},[3092,4674,3504],{"class":3106},[3092,4676,3111],{"class":3110},[3092,4678,4679],{"class":3114},"\"Оберіть режим:\"\n",[3092,4681,4682,4684,4686,4688,4690,4692,4695],{"class":3094,"line":3145},[3092,4683,3221],{"class":3106},[3092,4685,3111],{"class":3110},[3092,4687,3518],{"class":3114},[3092,4689,3837],{"class":3106},[3092,4691,3111],{"class":3110},[3092,4693,4694],{"class":3114},"\"13\"",[3092,4696,3189],{"class":3098},[3092,4698,4699,4701,4703,4705,4707,4709,4711,4713,4715],{"class":3094,"line":3156},[3092,4700,3132],{"class":3098},[3092,4702,3103],{"class":3102},[3092,4704,3561],{"class":3106},[3092,4706,3111],{"class":3110},[3092,4708,3566],{"class":3114},[3092,4710,3118],{"class":3106},[3092,4712,3111],{"class":3110},[3092,4714,3573],{"class":3114},[3092,4716,3126],{"class":3098},[3092,4718,4719,4721,4723,4725,4727],{"class":3094,"line":3167},[3092,4720,3580],{"class":3098},[3092,4722,2972],{"class":3102},[3092,4724,3585],{"class":3106},[3092,4726,3111],{"class":3110},[3092,4728,4729],{"class":3114},"\"🌙 Темна тема\"\n",[3092,4731,4732,4735,4737],{"class":3094,"line":3178},[3092,4733,4734],{"class":3106},"                  Padding",[3092,4736,3111],{"class":3110},[3092,4738,3610],{"class":3114},[3092,4740,4741,4743,4745],{"class":3094,"line":3192},[3092,4742,4315],{"class":3106},[3092,4744,3111],{"class":3110},[3092,4746,3620],{"class":3114},[3092,4748,4749,4751,4753,4756],{"class":3094,"line":3207},[3092,4750,4324],{"class":3106},[3092,4752,3111],{"class":3110},[3092,4754,4755],{"class":3114},"\"Тему перемкнуто!\"",[3092,4757,3189],{"class":3098},[3092,4759,4760,4762,4764,4766,4768],{"class":3094,"line":3218},[3092,4761,3580],{"class":3098},[3092,4763,2972],{"class":3102},[3092,4765,3585],{"class":3106},[3092,4767,3111],{"class":3110},[3092,4769,4770],{"class":3114},"\"🔔 Сповіщення\"\n",[3092,4772,4773,4776,4778],{"class":3094,"line":3229},[3092,4774,4775],{"class":3106},"                  IsChecked",[3092,4777,3111],{"class":3110},[3092,4779,3600],{"class":3114},[3092,4781,4782,4784,4786,4788],{"class":3094,"line":3242},[3092,4783,4734],{"class":3106},[3092,4785,3111],{"class":3110},[3092,4787,3186],{"class":3114},[3092,4789,3189],{"class":3098},[3092,4791,4792,4794,4796,4798,4800],{"class":3094,"line":3381},[3092,4793,3580],{"class":3098},[3092,4795,2972],{"class":3102},[3092,4797,3585],{"class":3106},[3092,4799,3111],{"class":3110},[3092,4801,4802],{"class":3114},"\"📌 Закріпити\"\n",[3092,4804,4805,4808,4810],{"class":3094,"line":3657},[3092,4806,4807],{"class":3106},"                  IsThreeState",[3092,4809,3111],{"class":3110},[3092,4811,3600],{"class":3114},[3092,4813,4814,4816,4818,4820],{"class":3094,"line":3666},[3092,4815,4734],{"class":3106},[3092,4817,3111],{"class":3110},[3092,4819,3186],{"class":3114},[3092,4821,3189],{"class":3098},[3092,4823,4824,4826,4828],{"class":3094,"line":3675},[3092,4825,3690],{"class":3098},[3092,4827,3103],{"class":3102},[3092,4829,3126],{"class":3098},[3092,4831,4832,4834,4836,4838,4840],{"class":3094,"line":3687},[3092,4833,3132],{"class":3098},[3092,4835,3197],{"class":3102},[3092,4837,3504],{"class":3106},[3092,4839,3111],{"class":3110},[3092,4841,4842],{"class":3114},"\"Третя кнопка має три стани — клікайте кілька разів.\"\n",[3092,4844,4845,4847,4849,4851,4853,4855,4857],{"class":3094,"line":3697},[3092,4846,3221],{"class":3106},[3092,4848,3111],{"class":3110},[3092,4850,3518],{"class":3114},[3092,4852,3837],{"class":3106},[3092,4854,3111],{"class":3110},[3092,4856,3123],{"class":3114},[3092,4858,3189],{"class":3098},[3092,4860,4861,4863,4865],{"class":3094,"line":4019},[3092,4862,3245],{"class":3098},[3092,4864,3103],{"class":3102},[3092,4866,3126],{"class":3098},[2955,4868,4869,4064,4871,4068,4874,4630,4877,4880,4881,4883,4884,4886],{},[2963,4870,2972],{},[2958,4872,4873],{},"базовим класом",[2963,4875,4876],{},"CheckBox",[2963,4878,4879],{},"RadioButton",". Ці два контроли, які ми розглянемо у наступних статтях, насправді наслідують від ",[2963,4882,2972],{}," і лише додають власну угоду щодо зовнішнього вигляду та логіки групування. Знаючи ",[2963,4885,2972],{}," — ви вже розумієте фундамент обох.",[3049,4888],{},[3009,4890,4892],{"id":4891},"image-відображення-зображень-у-wpf","Image: відображення зображень у WPF",[3056,4894,4896],{"id":4895},"чому-image-у-wpf-це-окрема-тема","Чому Image у WPF — це окрема тема",[3014,4898,4899,4900,4902,4903,4906,4907,4909,4910,4913,4914,4917],{},"Якщо ви мали досвід роботи з Windows Forms, то, мабуть, пам'ятаєте, що відображення зображення там зводилося до двох рядків: встановлення властивості ",[2963,4901,2975],{}," у компонент ",[2963,4904,4905],{},"PictureBox"," і вказівка шляху до файлу. WPF виглядає схожим за результатом, але принципово відрізняється за механізмом роботи. Щоб правильно використовувати ",[2963,4908,2975],{}," у WPF, потрібно розуміти дві ключові концепції: ",[2958,4911,4912],{},"як WPF посилається на ресурси всередині застосунку"," (система Pack URIs) та ",[2958,4915,4916],{},"як WPF вписує зображення у відведений простір"," (режими Stretch). Без розуміння цих двох речей ви неодноразово стикатиметесь із класичними помилками: зображення або не завантажується (неправильний URI), або виглядає розтягнутим та спотвореним (неправильний Stretch).",[3056,4919,4921],{"id":4920},"як-додати-зображення-до-проєкту-wpf","Як додати зображення до проєкту WPF",[3014,4923,4924,4925,4928,4929,4932],{},"Перш ніж щось відобразити, потрібно правильно включити графічний файл до складу проєкту. WPF-застосунок — це, по суті, ZIP-архів (",[2963,4926,4927],{},".exe"," або ",[2963,4930,4931],{},".dll","), і всі ресурси, до яких він звертається, мають бути або вбудовані у цей архів, або доступні за абсолютним шляхом файлової системи. Перший підхід значно надійніший і є рекомендованим для більшості сценаріїв.",[3014,4934,4935],{},"Процедура підключення зображення виглядає так:",[4937,4938,4939,4943,4954,4958,4973,4977],"steps",{},[3056,4940,4942],{"id":4941},"крок-1-розмістіть-файл-у-проєкті","Крок 1: Розмістіть файл у проєкті",[3014,4944,4945,4946,4949,4950,4953],{},"Додайте файл зображення до папки у вашому проєкті (наприклад, ",[2963,4947,4948],{},"Assets/Images/logo.png","). Це можна зробити через меню ",[2958,4951,4952],{},"Project → Add Existing Item..."," або простим перетягуванням файлу у Solution Explorer.",[3056,4955,4957],{"id":4956},"крок-2-встановіть-build-action-resource","Крок 2: Встановіть Build Action = Resource",[3014,4959,4960,4961,4964,4965,4968,4969,4972],{},"У вікні властивостей файлу (клавіша ",[3434,4962],{"value":4963},"F4"," або правою кнопкою → Properties) знайдіть властивість ",[2958,4966,4967],{},"Build Action"," і встановіть значення ",[2958,4970,4971],{},"Resource",". Саме ця настройка інструктує MSBuild вбудувати файл у зкомпільований збірник (assembly) як binary resource.",[3056,4974,4976],{"id":4975},"крок-3-copy-to-output-directory-do-not-copy","Крок 3: Copy to Output Directory = Do not copy",[3014,4978,4979,4980,4983,4984,4987,4988,3007],{},"Властивість ",[2958,4981,4982],{},"Copy to Output Directory"," слід залишити значенням ",[2958,4985,4986],{},"Do not copy",". Зображення вже \"живе\" всередині збірника — немає потреби копіювати його ще й поруч із ",[2963,4989,4927],{},[4991,4992,4993,4994,4997,4998,5001,5002,5004],"caution",{},"Найпоширеніша помилка початківців — залишити ",[2958,4995,4996],{},"Build Action = None"," (значення за замовчуванням для зображень, доданих через Solution Explorer). У такому випадку файл фізично присутній у папці проєкту, але ",[2958,4999,5000],{},"не вбудовується у збірник",". Застосунок знайде зображення під час розробки (бо файл лежить поруч із проєктом на диску), але після публікації або встановлення на іншу машину зображення зникне — файлу поруч з ",[2963,5003,4927],{}," більше немає.",[3056,5006,5008],{"id":5007},"pack-uris-адресація-ресурсів-у-wpf","Pack URIs: адресація ресурсів у WPF",[3014,5010,5011],{},"Система Pack URIs — це стандарт адресації ресурсів, який WPF успадкував від специфікації XPS (XML Paper Specification). Pack URI виглядає незвично і на перший погляд справляє враження надлишково складного синтаксису, але він вирішує реальну проблему: однозначна адресація ресурсу незалежно від того, де він фізично знаходиться — вбудований у поточну збірку, чи розміщений у зовнішній сателітній збірці.",[3014,5013,5014],{},"Найпоширеніша форма Pack URI для ресурсів поточної збірки виглядає так:",[3083,5016,5021],{"className":5017,"code":5019,"language":5020},[5018],"language-text","pack://application:,,,/Assets/Images/logo.png\n","text",[2963,5022,5019],{"__ignoreMap":3088},[3014,5024,5025],{},"Розберемо цей URI по частинах:",[4550,5027,5028,5037],{},[4553,5029,5030],{},[4556,5031,5032,5035],{},[4559,5033,5034],{},"Частина",[4559,5036,4566],{},[4571,5038,5039,5049,5063],{},[4556,5040,5041,5046],{},[4576,5042,5043],{},[2963,5044,5045],{},"pack://",[4576,5047,5048],{},"Схема URI, специфічна для WPF",[4556,5050,5051,5056],{},[4576,5052,5053],{},[2963,5054,5055],{},"application:,,,",[4576,5057,5058,5059,5062],{},"Означає \"поточна збірка застосунку\" (три коми — це закодовані слеші ",[2963,5060,5061],{},"///",")",[4556,5064,5065,5070],{},[4576,5066,5067],{},[2963,5068,5069],{},"/Assets/Images/logo.png",[4576,5071,5072],{},"Шлях до ресурсу всередині збірки, відносно кореня проєкту",[3041,5074,5075,5076,5078,5079,5081,5082,5085],{},"У XAML-розмітці можна використовувати скорочений відносний URI — просто ",[2963,5077,5069],{}," або навіть ",[2963,5080,4948],{},". WPF автоматично розгортає його до повного Pack URI. Повний запис ",[2963,5083,5084],{},"pack://application:,,,/..."," потрібен лише тоді, коли ви формуєте URI у C#-коді або посилаєтесь на ресурс з іншої збірки.",[3014,5087,5088],{},"Подивимось на усі варіанти адресації у порівняльній таблиці:",[4550,5090,5091,5104],{},[4553,5092,5093],{},[4556,5094,5095,5098,5101],{},[4559,5096,5097],{},"Тип джерела",[4559,5099,5100],{},"Приклад URI",[4559,5102,5103],{},"Коли використовувати",[4571,5105,5106,5119,5132,5145,5158],{},[4556,5107,5108,5111,5116],{},[4576,5109,5110],{},"Ресурс поточної збірки (XAML)",[4576,5112,5113],{},[2963,5114,5115],{},"Source=\"/Assets/logo.png\"",[4576,5117,5118],{},"У більшості XAML-випадків",[4556,5120,5121,5124,5129],{},[4576,5122,5123],{},"Ресурс поточної збірки (C#)",[4576,5125,5126],{},[2963,5127,5128],{},"new Uri(\"pack://application:,,,/Assets/logo.png\")",[4576,5130,5131],{},"Динамічне завантаження у коді",[4556,5133,5134,5137,5142],{},[4576,5135,5136],{},"Ресурс іншої збірки",[4576,5138,5139],{},[2963,5140,5141],{},"pack://application:,,,/MyLib;component/Images/icon.png",[4576,5143,5144],{},"Реюзабельні бібліотеки контролів",[4556,5146,5147,5150,5155],{},[4576,5148,5149],{},"Абсолютний шлях файлової системи",[4576,5151,5152],{},[2963,5153,5154],{},"Source=\"C:/Users/user/Pictures/photo.jpg\"",[4576,5156,5157],{},"Зовнішні файли (наприклад, вибрані користувачем)",[4556,5159,5160,5163,5168],{},[4576,5161,5162],{},"URL зображення в Інтернеті",[4576,5164,5165],{},[2963,5166,5167],{},"Source=\"https://picsum.photos/320/200\"",[4576,5169,5170],{},"Онлайн-ресурси (асинхронне завантаження)",[3056,5172,5174],{"id":5173},"властивість-source-та-imagesource","Властивість Source та ImageSource",[3014,5176,5177,5178,3407,5180,5183,5184,5187,5188,5191,5192,5194,5195,5197,5198,5201],{},"Центральна властивість контролу ",[2963,5179,2975],{},[2963,5181,5182],{},"Source",", що має тип ",[2963,5185,5186],{},"ImageSource",". ",[2963,5189,5190],{},"BitmapImage"," — найпоширеніша реалізація ",[2963,5193,5186],{}," для растрових зображень (PNG, JPEG, BMP, GIF). У XAML перетворення рядка (Pack URI) на ",[2963,5196,5190],{}," відбувається автоматично завдяки вбудованому ",[2963,5199,5200],{},"TypeConverter",". У C#-коді доведеться створити об'єкт вручну:",[3083,5203,5205],{"className":3252,"code":5204,"language":3254,"meta":3088,"style":3088},"// Завантаження зображення з ресурсів у коді\nvar image = new Image();\nimage.Source = new BitmapImage(\n    new Uri(\"pack://application:,,,/Assets/Images/logo.png\")\n);\n",[2963,5206,5207,5213,5231,5250,5265],{"__ignoreMap":3088},[3092,5208,5209],{"class":3094,"line":3095},[3092,5210,5212],{"class":5211},"spJ8K","// Завантаження зображення з ресурсів у коді\n",[3092,5214,5215,5218,5221,5223,5226,5229],{"class":3094,"line":3129},[3092,5216,5217],{"class":3261},"var",[3092,5219,5220],{"class":3338}," image",[3092,5222,3367],{"class":3110},[3092,5224,5225],{"class":3261},"new",[3092,5227,5228],{"class":3271}," Image",[3092,5230,3307],{"class":3110},[3092,5232,5233,5236,5238,5240,5242,5244,5247],{"class":3094,"line":3145},[3092,5234,5235],{"class":3338},"image",[3092,5237,3007],{"class":3110},[3092,5239,5182],{"class":3338},[3092,5241,3367],{"class":3110},[3092,5243,5225],{"class":3261},[3092,5245,5246],{"class":3271}," BitmapImage",[3092,5248,5249],{"class":3110},"(\n",[3092,5251,5252,5255,5258,5260,5263],{"class":3094,"line":3156},[3092,5253,5254],{"class":3261},"    new",[3092,5256,5257],{"class":3271}," Uri",[3092,5259,3332],{"class":3110},[3092,5261,5262],{"class":3370},"\"pack://application:,,,/Assets/Images/logo.png\"",[3092,5264,3350],{"class":3110},[3092,5266,5267],{"class":3094,"line":3167},[3092,5268,5269],{"class":3110},");\n",[3079,5271,5273],{"title":5272},"Image: відображення з налаштуванням якості",[3083,5274,5276],{"className":3085,"code":5275,"language":3087,"meta":3088,"style":3088},"\u003CStackPanel Margin=\"20\" Spacing=\"12\">\n  \u003CTextBlock Text=\"Аватар користувача (зовнішній URL):\"\n             Foreground=\"Gray\" FontSize=\"13\"/>\n  \u003CImage Source=\"https://dummyimage.com/640x360/000/fff.png&text=Image\"\n         Width=\"120\" Height=\"120\"\n         RenderOptions.BitmapScalingMode=\"HighQuality\"/>\n  \u003CTextBlock Text=\"RenderOptions.BitmapScalingMode=HighQuality\"\n             Foreground=\"Gray\" FontSize=\"11\"/>\n\u003C/StackPanel>\n",[2963,5277,5278,5298,5311,5327,5347,5364,5376,5389,5406],{"__ignoreMap":3088},[3092,5279,5280,5282,5284,5286,5288,5290,5292,5294,5296],{"class":3094,"line":3095},[3092,5281,3099],{"class":3098},[3092,5283,3103],{"class":3102},[3092,5285,3107],{"class":3106},[3092,5287,3111],{"class":3110},[3092,5289,3115],{"class":3114},[3092,5291,3118],{"class":3106},[3092,5293,3111],{"class":3110},[3092,5295,3123],{"class":3114},[3092,5297,3126],{"class":3098},[3092,5299,5300,5302,5304,5306,5308],{"class":3094,"line":3129},[3092,5301,3132],{"class":3098},[3092,5303,3197],{"class":3102},[3092,5305,3504],{"class":3106},[3092,5307,3111],{"class":3110},[3092,5309,5310],{"class":3114},"\"Аватар користувача (зовнішній URL):\"\n",[3092,5312,5313,5315,5317,5319,5321,5323,5325],{"class":3094,"line":3145},[3092,5314,3221],{"class":3106},[3092,5316,3111],{"class":3110},[3092,5318,3518],{"class":3114},[3092,5320,3837],{"class":3106},[3092,5322,3111],{"class":3110},[3092,5324,4694],{"class":3114},[3092,5326,3189],{"class":3098},[3092,5328,5329,5331,5333,5336,5338,5341,5344],{"class":3094,"line":3156},[3092,5330,3132],{"class":3098},[3092,5332,2975],{"class":3102},[3092,5334,5335],{"class":3106}," Source",[3092,5337,3111],{"class":3110},[3092,5339,5340],{"class":3114},"\"https://dummyimage.com/640x360/000/fff.png",[3092,5342,5343],{"class":3261},"&",[3092,5345,5346],{"class":3114},"text=Image\"\n",[3092,5348,5349,5352,5354,5357,5359,5361],{"class":3094,"line":3167},[3092,5350,5351],{"class":3106},"         Width",[3092,5353,3111],{"class":3110},[3092,5355,5356],{"class":3114},"\"120\"",[3092,5358,3959],{"class":3106},[3092,5360,3111],{"class":3110},[3092,5362,5363],{"class":3114},"\"120\"\n",[3092,5365,5366,5369,5371,5374],{"class":3094,"line":3178},[3092,5367,5368],{"class":3106},"         RenderOptions.BitmapScalingMode",[3092,5370,3111],{"class":3110},[3092,5372,5373],{"class":3114},"\"HighQuality\"",[3092,5375,3189],{"class":3098},[3092,5377,5378,5380,5382,5384,5386],{"class":3094,"line":3192},[3092,5379,3132],{"class":3098},[3092,5381,3197],{"class":3102},[3092,5383,3504],{"class":3106},[3092,5385,3111],{"class":3110},[3092,5387,5388],{"class":3114},"\"RenderOptions.BitmapScalingMode=HighQuality\"\n",[3092,5390,5391,5393,5395,5397,5399,5401,5404],{"class":3094,"line":3207},[3092,5392,3221],{"class":3106},[3092,5394,3111],{"class":3110},[3092,5396,3518],{"class":3114},[3092,5398,3837],{"class":3106},[3092,5400,3111],{"class":3110},[3092,5402,5403],{"class":3114},"\"11\"",[3092,5405,3189],{"class":3098},[3092,5407,5408,5410,5412],{"class":3094,"line":3218},[3092,5409,3245],{"class":3098},[3092,5411,3103],{"class":3102},[3092,5413,3126],{"class":3098},[2955,5415,4979,5416,5419,5420,5423,5424,5427,5428,5423,5431,5434],{},[2963,5417,5418],{},"RenderOptions.BitmapScalingMode"," — це прикріплена властивість (Attached Property), що керує алгоритмом масштабування растрового зображення при відображенні у розмірах, відмінних від оригінальних. Значення ",[2963,5421,5422],{},"HighQuality"," (або ",[2963,5425,5426],{},"Fant",") дає найкращу якість, але коштує трохи продуктивності; ",[2963,5429,5430],{},"LowQuality",[2963,5432,5433],{},"NearestNeighbor",") — максимально швидке, але \"пікселізоване\" масштабування. Детальніше про Attached Properties — у Блоці 5.",[3056,5436,5438],{"id":5437},"режими-stretch-як-wpf-вписує-зображення-у-контейнер","Режими Stretch: як WPF вписує зображення у контейнер",[3014,5440,5441,5442,5444,5445,5448,5449,5451],{},"Уявіть, що у вас є зображення розміром 800×600 пікселів, а ",[2963,5443,2975],{},"-контрол займає лише 200×200 логічних одиниць. Що має зробити WPF? Залишити зображення оригінального розміру і обрізати зайве? Стиснути пропорційно? Стиснути з порушенням пропорцій, аби заповнити весь простір? Саме ці сценарії регулює властивість ",[2963,5446,5447],{},"Stretch"," — один із найбільш нерозуміних аспектів ",[2963,5450,2975],{}," у початківців.",[3014,5453,5454],{},"Можливих значень чотири, і їх варто знати напам'ять:",[5456,5457,5458,5467,5478,5486],"card-group",{},[5459,5460,5462,5463,5466],"card",{"title":5461},"None","Зображення відображається ",[2958,5464,5465],{},"у своєму оригінальному розмірі"," — без будь-якого масштабування. Якщо зображення більше за контрол — воно обрізається. Якщо менше — навколо нього будуть порожні поля. Використовується рідко: наприклад, для піксель-перфектного відображення невеликих іконок у фіксованому розмірі.",[5459,5468,5470,5471,5474,5475,5477],{"title":5469},"Fill","Зображення розтягується так, щоб ",[2958,5472,5473],{},"заповнити весь простір контролу",", ігноруючи оригінальні пропорції. Ширина ",[2963,5476,2975],{},"-контролу стає шириною зображення, висота — висотою. Якщо пропорції розрізняються — зображення буде спотворено. Майже ніколи не є правильним вибором для фотографій і логотипів.",[5459,5479,5481,5482,5485],{"title":5480},"Uniform (за замовчуванням)","Зображення масштабується ",[2958,5483,5484],{},"пропорційно"," таким чином, щоб повністю вміститись у відведених розмірах. Пропорції завжди зберігаються. Якщо співвідношення сторін зображення відрізняється від співвідношення сторін контролу — з'являться порожні смуги (\"letterboxing\"). Це найбезпечніший режим для загального використання.",[5459,5487,5481,5489,5491,5492,5495],{"title":5488},"UniformToFill",[2958,5490,5484],{}," таким чином, щоб ",[2958,5493,5494],{},"повністю заповнити"," відведений простір. Пропорції зберігаються. Якщо співвідношення сторін відрізняються — частини зображення, що виходять за межі контролу, обрізаються. Ідеально підходить для фонових зображень та аватарів, де важливо заповнити весь простір без порожніх смуг.",[3014,5497,5498],{},"Щоб різниця між режимами стала наочною, розглянемо кожен у живому прикладі. Зображення оригінального розміру — широке (landscape), контрол — квадратний. Це найкращий тест для спостереження поведінки Stretch:",[3079,5500,5502],{"title":5501},"Stretch.None — оригінальний розмір без масштабування",[3083,5503,5505],{"className":3085,"code":5504,"language":3087,"meta":3088,"style":3088},"\u003CStackPanel Margin=\"20\" Spacing=\"8\">\n  \u003CTextBlock Text=\"Stretch.None\" FontWeight=\"Bold\"/>\n  \u003CTextBlock Text=\"Зображення відображається у оригінальному розмірі. Якщо воно більше за контрол — обрізається.\"\n             Foreground=\"Gray\" FontSize=\"12\" TextWrapping=\"Wrap\"/>\n  \u003CBorder Width=\"160\" Height=\"160\" Background=\"#1A1A2E\"\n          BorderBrush=\"#3A3A5C\" BorderThickness=\"1\">\n    \u003CImage Source=\"https://dummyimage.com/640x360/000/fff.png&text=Stretch.Fill\"\n           Stretch=\"None\"/>\n  \u003C/Border>\n\u003C/StackPanel>\n",[2963,5506,5507,5527,5549,5562,5586,5614,5634,5651,5663,5671],{"__ignoreMap":3088},[3092,5508,5509,5511,5513,5515,5517,5519,5521,5523,5525],{"class":3094,"line":3095},[3092,5510,3099],{"class":3098},[3092,5512,3103],{"class":3102},[3092,5514,3107],{"class":3106},[3092,5516,3111],{"class":3110},[3092,5518,3115],{"class":3114},[3092,5520,3118],{"class":3106},[3092,5522,3111],{"class":3110},[3092,5524,3573],{"class":3114},[3092,5526,3126],{"class":3098},[3092,5528,5529,5531,5533,5535,5537,5540,5542,5544,5547],{"class":3094,"line":3129},[3092,5530,3132],{"class":3098},[3092,5532,3197],{"class":3102},[3092,5534,3504],{"class":3106},[3092,5536,3111],{"class":3110},[3092,5538,5539],{"class":3114},"\"Stretch.None\"",[3092,5541,4357],{"class":3106},[3092,5543,3111],{"class":3110},[3092,5545,5546],{"class":3114},"\"Bold\"",[3092,5548,3189],{"class":3098},[3092,5550,5551,5553,5555,5557,5559],{"class":3094,"line":3145},[3092,5552,3132],{"class":3098},[3092,5554,3197],{"class":3102},[3092,5556,3504],{"class":3106},[3092,5558,3111],{"class":3110},[3092,5560,5561],{"class":3114},"\"Зображення відображається у оригінальному розмірі. Якщо воно більше за контрол — обрізається.\"\n",[3092,5563,5564,5566,5568,5570,5572,5574,5576,5579,5581,5584],{"class":3094,"line":3156},[3092,5565,3221],{"class":3106},[3092,5567,3111],{"class":3110},[3092,5569,3518],{"class":3114},[3092,5571,3837],{"class":3106},[3092,5573,3111],{"class":3110},[3092,5575,3123],{"class":3114},[3092,5577,5578],{"class":3106}," TextWrapping",[3092,5580,3111],{"class":3110},[3092,5582,5583],{"class":3114},"\"Wrap\"",[3092,5585,3189],{"class":3098},[3092,5587,5588,5590,5593,5595,5597,5600,5602,5604,5606,5609,5611],{"class":3094,"line":3167},[3092,5589,3132],{"class":3098},[3092,5591,5592],{"class":3102},"Border",[3092,5594,3529],{"class":3106},[3092,5596,3111],{"class":3110},[3092,5598,5599],{"class":3114},"\"160\"",[3092,5601,3959],{"class":3106},[3092,5603,3111],{"class":3110},[3092,5605,5599],{"class":3114},[3092,5607,5608],{"class":3106}," Background",[3092,5610,3111],{"class":3110},[3092,5612,5613],{"class":3114},"\"#1A1A2E\"\n",[3092,5615,5616,5619,5621,5624,5627,5629,5632],{"class":3094,"line":3178},[3092,5617,5618],{"class":3106},"          BorderBrush",[3092,5620,3111],{"class":3110},[3092,5622,5623],{"class":3114},"\"#3A3A5C\"",[3092,5625,5626],{"class":3106}," BorderThickness",[3092,5628,3111],{"class":3110},[3092,5630,5631],{"class":3114},"\"1\"",[3092,5633,3126],{"class":3098},[3092,5635,5636,5638,5640,5642,5644,5646,5648],{"class":3094,"line":3192},[3092,5637,3580],{"class":3098},[3092,5639,2975],{"class":3102},[3092,5641,5335],{"class":3106},[3092,5643,3111],{"class":3110},[3092,5645,5340],{"class":3114},[3092,5647,5343],{"class":3261},[3092,5649,5650],{"class":3114},"text=Stretch.Fill\"\n",[3092,5652,5653,5656,5658,5661],{"class":3094,"line":3207},[3092,5654,5655],{"class":3106},"           Stretch",[3092,5657,3111],{"class":3110},[3092,5659,5660],{"class":3114},"\"None\"",[3092,5662,3189],{"class":3098},[3092,5664,5665,5667,5669],{"class":3094,"line":3218},[3092,5666,3690],{"class":3098},[3092,5668,5592],{"class":3102},[3092,5670,3126],{"class":3098},[3092,5672,5673,5675,5677],{"class":3094,"line":3229},[3092,5674,3245],{"class":3098},[3092,5676,3103],{"class":3102},[3092,5678,3126],{"class":3098},[3079,5680,5682],{"title":5681},"Stretch.Fill — заповнення з порушенням пропорцій",[3083,5683,5685],{"className":3085,"code":5684,"language":3087,"meta":3088,"style":3088},"\u003CStackPanel Margin=\"20\" Spacing=\"8\">\n  \u003CTextBlock Text=\"Stretch.Fill\" FontWeight=\"Bold\"/>\n  \u003CTextBlock Text=\"Зображення розтягується на весь контрол. Пропорції порушуються — зображення спотворюється.\"\n             Foreground=\"Gray\" FontSize=\"12\" TextWrapping=\"Wrap\"/>\n  \u003CBorder Width=\"160\" Height=\"160\" Background=\"#1A1A2E\"\n          BorderBrush=\"#3A3A5C\" BorderThickness=\"1\">\n    \u003CImage Source=\"https://dummyimage.com/640x360/000/fff.png&text=Stretch.Uniform\"\n           Stretch=\"Fill\"/>\n  \u003C/Border>\n\u003C/StackPanel>\n",[2963,5686,5687,5707,5728,5741,5763,5787,5803,5820,5831,5839],{"__ignoreMap":3088},[3092,5688,5689,5691,5693,5695,5697,5699,5701,5703,5705],{"class":3094,"line":3095},[3092,5690,3099],{"class":3098},[3092,5692,3103],{"class":3102},[3092,5694,3107],{"class":3106},[3092,5696,3111],{"class":3110},[3092,5698,3115],{"class":3114},[3092,5700,3118],{"class":3106},[3092,5702,3111],{"class":3110},[3092,5704,3573],{"class":3114},[3092,5706,3126],{"class":3098},[3092,5708,5709,5711,5713,5715,5717,5720,5722,5724,5726],{"class":3094,"line":3129},[3092,5710,3132],{"class":3098},[3092,5712,3197],{"class":3102},[3092,5714,3504],{"class":3106},[3092,5716,3111],{"class":3110},[3092,5718,5719],{"class":3114},"\"Stretch.Fill\"",[3092,5721,4357],{"class":3106},[3092,5723,3111],{"class":3110},[3092,5725,5546],{"class":3114},[3092,5727,3189],{"class":3098},[3092,5729,5730,5732,5734,5736,5738],{"class":3094,"line":3145},[3092,5731,3132],{"class":3098},[3092,5733,3197],{"class":3102},[3092,5735,3504],{"class":3106},[3092,5737,3111],{"class":3110},[3092,5739,5740],{"class":3114},"\"Зображення розтягується на весь контрол. Пропорції порушуються — зображення спотворюється.\"\n",[3092,5742,5743,5745,5747,5749,5751,5753,5755,5757,5759,5761],{"class":3094,"line":3156},[3092,5744,3221],{"class":3106},[3092,5746,3111],{"class":3110},[3092,5748,3518],{"class":3114},[3092,5750,3837],{"class":3106},[3092,5752,3111],{"class":3110},[3092,5754,3123],{"class":3114},[3092,5756,5578],{"class":3106},[3092,5758,3111],{"class":3110},[3092,5760,5583],{"class":3114},[3092,5762,3189],{"class":3098},[3092,5764,5765,5767,5769,5771,5773,5775,5777,5779,5781,5783,5785],{"class":3094,"line":3167},[3092,5766,3132],{"class":3098},[3092,5768,5592],{"class":3102},[3092,5770,3529],{"class":3106},[3092,5772,3111],{"class":3110},[3092,5774,5599],{"class":3114},[3092,5776,3959],{"class":3106},[3092,5778,3111],{"class":3110},[3092,5780,5599],{"class":3114},[3092,5782,5608],{"class":3106},[3092,5784,3111],{"class":3110},[3092,5786,5613],{"class":3114},[3092,5788,5789,5791,5793,5795,5797,5799,5801],{"class":3094,"line":3178},[3092,5790,5618],{"class":3106},[3092,5792,3111],{"class":3110},[3092,5794,5623],{"class":3114},[3092,5796,5626],{"class":3106},[3092,5798,3111],{"class":3110},[3092,5800,5631],{"class":3114},[3092,5802,3126],{"class":3098},[3092,5804,5805,5807,5809,5811,5813,5815,5817],{"class":3094,"line":3192},[3092,5806,3580],{"class":3098},[3092,5808,2975],{"class":3102},[3092,5810,5335],{"class":3106},[3092,5812,3111],{"class":3110},[3092,5814,5340],{"class":3114},[3092,5816,5343],{"class":3261},[3092,5818,5819],{"class":3114},"text=Stretch.Uniform\"\n",[3092,5821,5822,5824,5826,5829],{"class":3094,"line":3207},[3092,5823,5655],{"class":3106},[3092,5825,3111],{"class":3110},[3092,5827,5828],{"class":3114},"\"Fill\"",[3092,5830,3189],{"class":3098},[3092,5832,5833,5835,5837],{"class":3094,"line":3218},[3092,5834,3690],{"class":3098},[3092,5836,5592],{"class":3102},[3092,5838,3126],{"class":3098},[3092,5840,5841,5843,5845],{"class":3094,"line":3229},[3092,5842,3245],{"class":3098},[3092,5844,3103],{"class":3102},[3092,5846,3126],{"class":3098},[3079,5848,5850],{"title":5849},"Stretch.Uniform — пропорційне масштабування (за замовчуванням)",[3083,5851,5853],{"className":3085,"code":5852,"language":3087,"meta":3088,"style":3088},"\u003CStackPanel Margin=\"20\" Spacing=\"8\">\n  \u003CTextBlock Text=\"Stretch.Uniform (за замовчуванням)\" FontWeight=\"Bold\"/>\n  \u003CTextBlock Text=\"Зображення вміщується повністю, пропорції збережено. Можливі порожні смуги збоку або зверху.\"\n             Foreground=\"Gray\" FontSize=\"12\" TextWrapping=\"Wrap\"/>\n  \u003CBorder Width=\"160\" Height=\"160\" Background=\"#1A1A2E\"\n          BorderBrush=\"#3A3A5C\" BorderThickness=\"1\">\n    \u003CImage Source=\"https://dummyimage.com/640x360/000/fff.png&text=Stretch.UniformToFill\"\n           Stretch=\"Uniform\"/>\n  \u003C/Border>\n\u003C/StackPanel>\n",[2963,5854,5855,5875,5896,5909,5931,5955,5971,5988,5999,6007],{"__ignoreMap":3088},[3092,5856,5857,5859,5861,5863,5865,5867,5869,5871,5873],{"class":3094,"line":3095},[3092,5858,3099],{"class":3098},[3092,5860,3103],{"class":3102},[3092,5862,3107],{"class":3106},[3092,5864,3111],{"class":3110},[3092,5866,3115],{"class":3114},[3092,5868,3118],{"class":3106},[3092,5870,3111],{"class":3110},[3092,5872,3573],{"class":3114},[3092,5874,3126],{"class":3098},[3092,5876,5877,5879,5881,5883,5885,5888,5890,5892,5894],{"class":3094,"line":3129},[3092,5878,3132],{"class":3098},[3092,5880,3197],{"class":3102},[3092,5882,3504],{"class":3106},[3092,5884,3111],{"class":3110},[3092,5886,5887],{"class":3114},"\"Stretch.Uniform (за замовчуванням)\"",[3092,5889,4357],{"class":3106},[3092,5891,3111],{"class":3110},[3092,5893,5546],{"class":3114},[3092,5895,3189],{"class":3098},[3092,5897,5898,5900,5902,5904,5906],{"class":3094,"line":3145},[3092,5899,3132],{"class":3098},[3092,5901,3197],{"class":3102},[3092,5903,3504],{"class":3106},[3092,5905,3111],{"class":3110},[3092,5907,5908],{"class":3114},"\"Зображення вміщується повністю, пропорції збережено. Можливі порожні смуги збоку або зверху.\"\n",[3092,5910,5911,5913,5915,5917,5919,5921,5923,5925,5927,5929],{"class":3094,"line":3156},[3092,5912,3221],{"class":3106},[3092,5914,3111],{"class":3110},[3092,5916,3518],{"class":3114},[3092,5918,3837],{"class":3106},[3092,5920,3111],{"class":3110},[3092,5922,3123],{"class":3114},[3092,5924,5578],{"class":3106},[3092,5926,3111],{"class":3110},[3092,5928,5583],{"class":3114},[3092,5930,3189],{"class":3098},[3092,5932,5933,5935,5937,5939,5941,5943,5945,5947,5949,5951,5953],{"class":3094,"line":3167},[3092,5934,3132],{"class":3098},[3092,5936,5592],{"class":3102},[3092,5938,3529],{"class":3106},[3092,5940,3111],{"class":3110},[3092,5942,5599],{"class":3114},[3092,5944,3959],{"class":3106},[3092,5946,3111],{"class":3110},[3092,5948,5599],{"class":3114},[3092,5950,5608],{"class":3106},[3092,5952,3111],{"class":3110},[3092,5954,5613],{"class":3114},[3092,5956,5957,5959,5961,5963,5965,5967,5969],{"class":3094,"line":3178},[3092,5958,5618],{"class":3106},[3092,5960,3111],{"class":3110},[3092,5962,5623],{"class":3114},[3092,5964,5626],{"class":3106},[3092,5966,3111],{"class":3110},[3092,5968,5631],{"class":3114},[3092,5970,3126],{"class":3098},[3092,5972,5973,5975,5977,5979,5981,5983,5985],{"class":3094,"line":3192},[3092,5974,3580],{"class":3098},[3092,5976,2975],{"class":3102},[3092,5978,5335],{"class":3106},[3092,5980,3111],{"class":3110},[3092,5982,5340],{"class":3114},[3092,5984,5343],{"class":3261},[3092,5986,5987],{"class":3114},"text=Stretch.UniformToFill\"\n",[3092,5989,5990,5992,5994,5997],{"class":3094,"line":3207},[3092,5991,5655],{"class":3106},[3092,5993,3111],{"class":3110},[3092,5995,5996],{"class":3114},"\"Uniform\"",[3092,5998,3189],{"class":3098},[3092,6000,6001,6003,6005],{"class":3094,"line":3218},[3092,6002,3690],{"class":3098},[3092,6004,5592],{"class":3102},[3092,6006,3126],{"class":3098},[3092,6008,6009,6011,6013],{"class":3094,"line":3229},[3092,6010,3245],{"class":3098},[3092,6012,3103],{"class":3102},[3092,6014,3126],{"class":3098},[3079,6016,6018],{"title":6017},"Stretch.UniformToFill — заповнення з обрізанням країв",[3083,6019,6021],{"className":3085,"code":6020,"language":3087,"meta":3088,"style":3088},"\u003CStackPanel Margin=\"20\" Spacing=\"8\">\n  \u003CTextBlock Text=\"Stretch.UniformToFill\" FontWeight=\"Bold\"/>\n  \u003CTextBlock Text=\"Зображення заповнює весь контрол, пропорції збережено. Частина зображення обрізається.\"\n             Foreground=\"Gray\" FontSize=\"12\" TextWrapping=\"Wrap\"/>\n  \u003CBorder Width=\"160\" Height=\"160\" Background=\"#1A1A2E\"\n          BorderBrush=\"#3A3A5C\" BorderThickness=\"1\">\n    \u003CImage Source=\"https://dummyimage.com/640x360/000/fff.png&text=Stretch.None\"\n           Stretch=\"UniformToFill\"/>\n  \u003C/Border>\n\u003C/StackPanel>\n",[2963,6022,6023,6043,6064,6077,6099,6123,6139,6156,6167,6175],{"__ignoreMap":3088},[3092,6024,6025,6027,6029,6031,6033,6035,6037,6039,6041],{"class":3094,"line":3095},[3092,6026,3099],{"class":3098},[3092,6028,3103],{"class":3102},[3092,6030,3107],{"class":3106},[3092,6032,3111],{"class":3110},[3092,6034,3115],{"class":3114},[3092,6036,3118],{"class":3106},[3092,6038,3111],{"class":3110},[3092,6040,3573],{"class":3114},[3092,6042,3126],{"class":3098},[3092,6044,6045,6047,6049,6051,6053,6056,6058,6060,6062],{"class":3094,"line":3129},[3092,6046,3132],{"class":3098},[3092,6048,3197],{"class":3102},[3092,6050,3504],{"class":3106},[3092,6052,3111],{"class":3110},[3092,6054,6055],{"class":3114},"\"Stretch.UniformToFill\"",[3092,6057,4357],{"class":3106},[3092,6059,3111],{"class":3110},[3092,6061,5546],{"class":3114},[3092,6063,3189],{"class":3098},[3092,6065,6066,6068,6070,6072,6074],{"class":3094,"line":3145},[3092,6067,3132],{"class":3098},[3092,6069,3197],{"class":3102},[3092,6071,3504],{"class":3106},[3092,6073,3111],{"class":3110},[3092,6075,6076],{"class":3114},"\"Зображення заповнює весь контрол, пропорції збережено. Частина зображення обрізається.\"\n",[3092,6078,6079,6081,6083,6085,6087,6089,6091,6093,6095,6097],{"class":3094,"line":3156},[3092,6080,3221],{"class":3106},[3092,6082,3111],{"class":3110},[3092,6084,3518],{"class":3114},[3092,6086,3837],{"class":3106},[3092,6088,3111],{"class":3110},[3092,6090,3123],{"class":3114},[3092,6092,5578],{"class":3106},[3092,6094,3111],{"class":3110},[3092,6096,5583],{"class":3114},[3092,6098,3189],{"class":3098},[3092,6100,6101,6103,6105,6107,6109,6111,6113,6115,6117,6119,6121],{"class":3094,"line":3167},[3092,6102,3132],{"class":3098},[3092,6104,5592],{"class":3102},[3092,6106,3529],{"class":3106},[3092,6108,3111],{"class":3110},[3092,6110,5599],{"class":3114},[3092,6112,3959],{"class":3106},[3092,6114,3111],{"class":3110},[3092,6116,5599],{"class":3114},[3092,6118,5608],{"class":3106},[3092,6120,3111],{"class":3110},[3092,6122,5613],{"class":3114},[3092,6124,6125,6127,6129,6131,6133,6135,6137],{"class":3094,"line":3178},[3092,6126,5618],{"class":3106},[3092,6128,3111],{"class":3110},[3092,6130,5623],{"class":3114},[3092,6132,5626],{"class":3106},[3092,6134,3111],{"class":3110},[3092,6136,5631],{"class":3114},[3092,6138,3126],{"class":3098},[3092,6140,6141,6143,6145,6147,6149,6151,6153],{"class":3094,"line":3192},[3092,6142,3580],{"class":3098},[3092,6144,2975],{"class":3102},[3092,6146,5335],{"class":3106},[3092,6148,3111],{"class":3110},[3092,6150,5340],{"class":3114},[3092,6152,5343],{"class":3261},[3092,6154,6155],{"class":3114},"text=Stretch.None\"\n",[3092,6157,6158,6160,6162,6165],{"class":3094,"line":3207},[3092,6159,5655],{"class":3106},[3092,6161,3111],{"class":3110},[3092,6163,6164],{"class":3114},"\"UniformToFill\"",[3092,6166,3189],{"class":3098},[3092,6168,6169,6171,6173],{"class":3094,"line":3218},[3092,6170,3690],{"class":3098},[3092,6172,5592],{"class":3102},[3092,6174,3126],{"class":3098},[3092,6176,6177,6179,6181],{"class":3094,"line":3229},[3092,6178,3245],{"class":3098},[3092,6180,3103],{"class":3102},[3092,6182,3126],{"class":3098},[3041,6184,6185,6186,6189,6190,6193,6194,6196,6197,6200,6201,6203,6204,6206],{},"Для аватарів, фонових зображень та банерів використовуйте ",[2963,6187,6188],{},"Stretch=\"UniformToFill\""," у поєднанні з ",[2963,6191,6192],{},"ClipToBounds=\"True\""," на ",[2963,6195,5592],{},"-контейнері. ",[2963,6198,6199],{},"ClipToBounds"," гарантує, що частини зображення, які виходять за межі ",[2963,6202,5592],{},", не відображатимуться навіть якщо ",[2963,6205,2975],{}," за розміром більший.",[3014,6208,6209],{},"Для зручного запам'ятовування — зведена таблиця:",[4550,6211,6212,6230],{},[4553,6213,6214],{},[4556,6215,6216,6218,6221,6224,6227],{},[4559,6217,5447],{},[4559,6219,6220],{},"Пропорції",[4559,6222,6223],{},"Заповнює весь простір",[4559,6225,6226],{},"Може обрізати",[4559,6228,6229],{},"Типовий use case",[4571,6231,6232,6250,6267,6284],{},[4556,6233,6234,6238,6241,6244,6247],{},[4576,6235,6236],{},[2963,6237,5461],{},[4576,6239,6240],{},"✅ Зберігає",[4576,6242,6243],{},"❌ Ні",[4576,6245,6246],{},"✅ Так (якщо велике)",[4576,6248,6249],{},"Піксель-перфектні іконки",[4556,6251,6252,6256,6259,6262,6264],{},[4576,6253,6254],{},[2963,6255,5469],{},[4576,6257,6258],{},"❌ Порушує",[4576,6260,6261],{},"✅ Так",[4576,6263,6243],{},[4576,6265,6266],{},"Майже ніколи",[4556,6268,6269,6274,6276,6279,6281],{},[4576,6270,6271],{},[2963,6272,6273],{},"Uniform",[4576,6275,6240],{},[4576,6277,6278],{},"❌ Ні (смуги)",[4576,6280,6243],{},[4576,6282,6283],{},"Загальне відображення",[4556,6285,6286,6290,6292,6294,6297],{},[4576,6287,6288],{},[2963,6289,5488],{},[4576,6291,6240],{},[4576,6293,6261],{},[4576,6295,6296],{},"✅ Так (краї)",[4576,6298,6299],{},"Аватари, обкладинки",[2955,6301,6302,6303,6305,6306,6308,6309,6311],{},"Превью використовує Avalonia Fluent Theme і виглядає як Windows 11. У реальному WPF-проєкті поведінка ",[2963,6304,5447],{}," ідентична — це властивість самого ",[2963,6307,2975],{},"-контролу, незалежна від теми. Зовнішній вигляд ",[2963,6310,5592],{}," (рамки контейнера) може незначно відрізнятись.",[3049,6313],{},[3009,6315,6317],{"id":6316},"progressbar-індикатор-виконання-операцій","ProgressBar: індикатор виконання операцій",[3056,6319,6321],{"id":6320},"роль-індикатора-прогресу-у-користувацькому-досвіді","Роль індикатора прогресу у користувацькому досвіді",[3014,6323,6324],{},"Уявіть застосунок, який завантажує великий файл, виконує складний обрахунок або синхронізується з сервером. Що відбувається з інтерфейсом у цей час? Якщо розробник нічого не передбачив — вікно \"завмирає\", перестає реагувати на дії користувача, і той бачить лише нерухомий екран. Без жодного сигналу про те, що відбувається і скільки це триватиме. Подібний досвід підриває довіру до застосунку та змушує думати про \"зависання\".",[3014,6326,6327,6329,6330,6332],{},[2963,6328,2978],{}," — це саме той контрол, який перетворює невизначеність очікування на зрозумілий, вимірюваний процес. Навіть якщо реальний прогрес виміряти неможливо (наприклад, невідомо, скільки чіпів обробить алгоритм — скористайтеся режимом ",[2963,6331,2997],{},"), сам факт анімації повідомляє: \"застосунок живий, він працює, зачекайте\".",[3014,6334,6335,6336,3724,6338,6341,6342,4630,6344,6346],{},"З точки зору архітектури WPF, ",[2963,6337,2978],{},[2963,6339,6340],{},"RangeBase"," — базового класу, що визначає концепцію \"значення у діапазоні\". Той самий клас є предком ",[2963,6343,2981],{},[2963,6345,4491],{},". Це елегантне рішення: незважаючи на зовнішню несхожість, всі три контроли поділяють спільний контракт: є мінімум, є максимум, є поточне значення.",[3056,6348,6350],{"id":6349},"ключові-властивості","Ключові властивості",[4139,6352,6353,6375,6388,6395,6411],{},[4142,6354,6357,6358,6366,6367,6370,6371,6374],{"name":6355,"type":6356},"Value","double","Поточне значення прогресу. Повинне знаходитись у діапазоні ",[3092,6359,6360,2966,6363],{},[2963,6361,6362],{},"Minimum",[2963,6364,6365],{},"Maximum",". За замовчуванням — ",[2963,6368,6369],{},"0",". Найчастіше прив'язується через ",[2963,6372,6373],{},"{Binding}"," до властивості ViewModel або встановлюється у code-behind під час виконання тривалої операції.",[4142,6376,6377,6378,6380,6381,4050,6384,6387],{"name":6362,"type":6356},"Нижня межа діапазону. За замовчуванням — ",[2963,6379,6369],{},". Звичайно, залишається нульовим, але може бути будь-яким числом. Наприклад, ",[2963,6382,6383],{},"Minimum=\"-100\"",[2963,6385,6386],{},"Maximum=\"100\""," для індикатора, що показує відхилення від нейтрального стану.",[4142,6389,6390,6391,6394],{"name":6365,"type":6356},"Верхня межа діапазону. За замовчуванням — ",[2963,6392,6393],{},"100",". Встановлюйте значення, що відповідає загальному обсягу роботи: кількості файлів, кількості записів, загальному розміру у байтах тощо.",[4142,6396,6398,6399,6401,6402,2966,6404,2966,6406,6408,6409,3007],{"name":2997,"type":6397},"bool","Якщо ",[2963,6400,3431],{}," — контрол переходить у режим невизначеного прогресу: замість фіксованої смуги показується \"пульсуюча\" анімація (\"серпантин\"). Властивості ",[2963,6403,6355],{},[2963,6405,6362],{},[2963,6407,6365],{}," у цьому режимі ігноруються. За замовчуванням — ",[2963,6410,4594],{},[4142,6412,6414,6415,6418,6419,6422,6423,6425],{"name":6413,"type":6413},"Orientation","Визначає напрямок заповнення: ",[2963,6416,6417],{},"Horizontal"," (за замовчуванням, ліворуч направо) або ",[2963,6420,6421],{},"Vertical"," (знизу вгору). Вертикальний ",[2963,6424,2978],{}," використовується рідко, але буває зручним для відображення рівнів (наприклад, рівень \"заряду\" батареї або гучності звуку).",[3056,6427,6429],{"id":6428},"визначений-прогрес-класичний-progressbar","Визначений прогрес: класичний ProgressBar",[3014,6431,6432,6433,2966,6436,2966,6439,6441],{},"Найпоширеніший сценарій — показ прогресу операції з відомим загальним обсягом. Наприклад, завантаження 150 файлів: ",[2963,6434,6435],{},"Minimum=0",[2963,6437,6438],{},"Maximum=150",[2963,6440,6355],{}," — поточна кількість завантажених файлів.",[3014,6443,6444,6445,6447],{},"У реальних застосунках ",[2963,6446,6355],{}," рідко встановлюється статично у XAML — зазвичай відбувається прив'язка до властивості ViewModel, яка оновлюється асинхронно. Але для розуміння роботи контролу виведемо статичний приклад:",[3079,6449,6451],{"title":6450},"ProgressBar: різні стани виконання",[3083,6452,6454],{"className":3085,"code":6453,"language":3087,"meta":3088,"style":3088},"\u003CStackPanel Margin=\"20\" Spacing=\"16\">\n  \u003CTextBlock Text=\"Стан 1: Початок операції (0%)\" Foreground=\"Gray\" FontSize=\"12\"/>\n  \u003CProgressBar Minimum=\"0\" Maximum=\"100\" Value=\"0\" Height=\"8\"/>\n\n  \u003CTextBlock Text=\"Стан 2: Частковий прогрес (35%)\" Foreground=\"Gray\" FontSize=\"12\"/>\n  \u003CProgressBar Minimum=\"0\" Maximum=\"100\" Value=\"35\" Height=\"8\"/>\n\n  \u003CTextBlock Text=\"Стан 3: Майже завершено (80%)\" Foreground=\"Gray\" FontSize=\"12\"/>\n  \u003CProgressBar Minimum=\"0\" Maximum=\"100\" Value=\"80\" Height=\"8\"/>\n\n  \u003CTextBlock Text=\"Стан 4: Завершено (100%)\" Foreground=\"#4CAF50\" FontSize=\"12\"/>\n  \u003CProgressBar Minimum=\"0\" Maximum=\"100\" Value=\"100\" Height=\"8\"/>\n\u003C/StackPanel>\n",[2963,6455,6456,6476,6504,6541,6545,6572,6605,6609,6636,6669,6673,6701,6733],{"__ignoreMap":3088},[3092,6457,6458,6460,6462,6464,6466,6468,6470,6472,6474],{"class":3094,"line":3095},[3092,6459,3099],{"class":3098},[3092,6461,3103],{"class":3102},[3092,6463,3107],{"class":3106},[3092,6465,3111],{"class":3110},[3092,6467,3115],{"class":3114},[3092,6469,3118],{"class":3106},[3092,6471,3111],{"class":3110},[3092,6473,4187],{"class":3114},[3092,6475,3126],{"class":3098},[3092,6477,6478,6480,6482,6484,6486,6489,6492,6494,6496,6498,6500,6502],{"class":3094,"line":3129},[3092,6479,3132],{"class":3098},[3092,6481,3197],{"class":3102},[3092,6483,3504],{"class":3106},[3092,6485,3111],{"class":3110},[3092,6487,6488],{"class":3114},"\"Стан 1: Початок операції (0%)\"",[3092,6490,6491],{"class":3106}," Foreground",[3092,6493,3111],{"class":3110},[3092,6495,3518],{"class":3114},[3092,6497,3837],{"class":3106},[3092,6499,3111],{"class":3110},[3092,6501,3123],{"class":3114},[3092,6503,3189],{"class":3098},[3092,6505,6506,6508,6510,6513,6515,6518,6521,6523,6526,6529,6531,6533,6535,6537,6539],{"class":3094,"line":3145},[3092,6507,3132],{"class":3098},[3092,6509,2978],{"class":3102},[3092,6511,6512],{"class":3106}," Minimum",[3092,6514,3111],{"class":3110},[3092,6516,6517],{"class":3114},"\"0\"",[3092,6519,6520],{"class":3106}," Maximum",[3092,6522,3111],{"class":3110},[3092,6524,6525],{"class":3114},"\"100\"",[3092,6527,6528],{"class":3106}," Value",[3092,6530,3111],{"class":3110},[3092,6532,6517],{"class":3114},[3092,6534,3959],{"class":3106},[3092,6536,3111],{"class":3110},[3092,6538,3573],{"class":3114},[3092,6540,3189],{"class":3098},[3092,6542,6543],{"class":3094,"line":3156},[3092,6544,3318],{"emptyLinePlaceholder":3317},[3092,6546,6547,6549,6551,6553,6555,6558,6560,6562,6564,6566,6568,6570],{"class":3094,"line":3167},[3092,6548,3132],{"class":3098},[3092,6550,3197],{"class":3102},[3092,6552,3504],{"class":3106},[3092,6554,3111],{"class":3110},[3092,6556,6557],{"class":3114},"\"Стан 2: Частковий прогрес (35%)\"",[3092,6559,6491],{"class":3106},[3092,6561,3111],{"class":3110},[3092,6563,3518],{"class":3114},[3092,6565,3837],{"class":3106},[3092,6567,3111],{"class":3110},[3092,6569,3123],{"class":3114},[3092,6571,3189],{"class":3098},[3092,6573,6574,6576,6578,6580,6582,6584,6586,6588,6590,6592,6594,6597,6599,6601,6603],{"class":3094,"line":3178},[3092,6575,3132],{"class":3098},[3092,6577,2978],{"class":3102},[3092,6579,6512],{"class":3106},[3092,6581,3111],{"class":3110},[3092,6583,6517],{"class":3114},[3092,6585,6520],{"class":3106},[3092,6587,3111],{"class":3110},[3092,6589,6525],{"class":3114},[3092,6591,6528],{"class":3106},[3092,6593,3111],{"class":3110},[3092,6595,6596],{"class":3114},"\"35\"",[3092,6598,3959],{"class":3106},[3092,6600,3111],{"class":3110},[3092,6602,3573],{"class":3114},[3092,6604,3189],{"class":3098},[3092,6606,6607],{"class":3094,"line":3192},[3092,6608,3318],{"emptyLinePlaceholder":3317},[3092,6610,6611,6613,6615,6617,6619,6622,6624,6626,6628,6630,6632,6634],{"class":3094,"line":3207},[3092,6612,3132],{"class":3098},[3092,6614,3197],{"class":3102},[3092,6616,3504],{"class":3106},[3092,6618,3111],{"class":3110},[3092,6620,6621],{"class":3114},"\"Стан 3: Майже завершено (80%)\"",[3092,6623,6491],{"class":3106},[3092,6625,3111],{"class":3110},[3092,6627,3518],{"class":3114},[3092,6629,3837],{"class":3106},[3092,6631,3111],{"class":3110},[3092,6633,3123],{"class":3114},[3092,6635,3189],{"class":3098},[3092,6637,6638,6640,6642,6644,6646,6648,6650,6652,6654,6656,6658,6661,6663,6665,6667],{"class":3094,"line":3218},[3092,6639,3132],{"class":3098},[3092,6641,2978],{"class":3102},[3092,6643,6512],{"class":3106},[3092,6645,3111],{"class":3110},[3092,6647,6517],{"class":3114},[3092,6649,6520],{"class":3106},[3092,6651,3111],{"class":3110},[3092,6653,6525],{"class":3114},[3092,6655,6528],{"class":3106},[3092,6657,3111],{"class":3110},[3092,6659,6660],{"class":3114},"\"80\"",[3092,6662,3959],{"class":3106},[3092,6664,3111],{"class":3110},[3092,6666,3573],{"class":3114},[3092,6668,3189],{"class":3098},[3092,6670,6671],{"class":3094,"line":3229},[3092,6672,3318],{"emptyLinePlaceholder":3317},[3092,6674,6675,6677,6679,6681,6683,6686,6688,6690,6693,6695,6697,6699],{"class":3094,"line":3242},[3092,6676,3132],{"class":3098},[3092,6678,3197],{"class":3102},[3092,6680,3504],{"class":3106},[3092,6682,3111],{"class":3110},[3092,6684,6685],{"class":3114},"\"Стан 4: Завершено (100%)\"",[3092,6687,6491],{"class":3106},[3092,6689,3111],{"class":3110},[3092,6691,6692],{"class":3114},"\"#4CAF50\"",[3092,6694,3837],{"class":3106},[3092,6696,3111],{"class":3110},[3092,6698,3123],{"class":3114},[3092,6700,3189],{"class":3098},[3092,6702,6703,6705,6707,6709,6711,6713,6715,6717,6719,6721,6723,6725,6727,6729,6731],{"class":3094,"line":3381},[3092,6704,3132],{"class":3098},[3092,6706,2978],{"class":3102},[3092,6708,6512],{"class":3106},[3092,6710,3111],{"class":3110},[3092,6712,6517],{"class":3114},[3092,6714,6520],{"class":3106},[3092,6716,3111],{"class":3110},[3092,6718,6525],{"class":3114},[3092,6720,6528],{"class":3106},[3092,6722,3111],{"class":3110},[3092,6724,6525],{"class":3114},[3092,6726,3959],{"class":3106},[3092,6728,3111],{"class":3110},[3092,6730,3573],{"class":3114},[3092,6732,3189],{"class":3098},[3092,6734,6735,6737,6739],{"class":3094,"line":3657},[3092,6736,3245],{"class":3098},[3092,6738,3103],{"class":3102},[3092,6740,3126],{"class":3098},[3014,6742,6743,6744,6747,6748,6750,6751,6753,6754,6760,6761,2966,6763,2966,6766,6769],{},"Зверніть увагу на кілька деталей. По-перше, ",[2963,6745,6746],{},"Height=\"8\""," — власний розмір ",[2963,6749,2978],{}," доволі великий (близько 20 логічних одиниць за замовчуванням), тому для \"тонкої\" смуги прогресу потрібно явно задавати висоту. По-друге, властивість ",[2963,6752,6355],{}," у межах ",[3092,6755,6756,2966,6758],{},[2963,6757,6362],{},[2963,6759,6365],{}," ніколи не потрібно нормалізовувати вручну — WPF сам обраховує відсоткове заповнення. Якщо ",[2963,6762,6435],{},[2963,6764,6765],{},"Maximum=500",[2963,6767,6768],{},"Value=250"," — смуга заповниться рівно вдвічі.",[3056,6771,6773],{"id":6772},"невизначений-прогрес-isindeterminate","Невизначений прогрес: IsIndeterminate",[3014,6775,6776,6777,6780,6781,6783],{},"Іноді заздалегідь неможливо знати, яку частку роботи вже виконано. Підключення до бази даних, очікування відповіді сервера, перший запуск алгоритму з невідомою складністю — це типові сценарії для ",[2963,6778,6779],{},"IsIndeterminate=\"True\"",". У цьому режимі ",[2963,6782,2978],{}," показує анімацію, що безперервно рухається від краю до краю (або пульсуючу підсвітку у Fluent Theme), сигналізуючи: \"застосунок зайнятий, але ми не знаємо коли закінчимо\".",[3079,6785,6787],{"title":6786},"ProgressBar: IsIndeterminate — невизначений прогрес",[3083,6788,6790],{"className":3085,"code":6789,"language":3087,"meta":3088,"style":3088},"\u003CStackPanel Margin=\"20\" Spacing=\"16\">\n  \u003CTextBlock Text=\"Визначений прогрес (завjs 60%):\" Foreground=\"Gray\" FontSize=\"12\"/>\n  \u003CProgressBar Minimum=\"0\" Maximum=\"100\" Value=\"60\" Height=\"10\"/>\n\n  \u003CTextBlock Text=\"Невизначений прогрес (IsIndeterminate=True):\"\n             Foreground=\"Gray\" FontSize=\"12\"/>\n  \u003CProgressBar IsIndeterminate=\"True\" Height=\"10\"/>\n\n  \u003CTextBlock Text=\"Вертикальний (Orientation=Vertical, 70%):\"\n             Foreground=\"Gray\" FontSize=\"12\"/>\n  \u003CProgressBar Minimum=\"0\" Maximum=\"100\" Value=\"70\"\n               Orientation=\"Vertical\"\n               Width=\"20\" Height=\"100\"\n               HorizontalAlignment=\"Left\"/>\n\u003C/StackPanel>\n",[2963,6791,6792,6812,6839,6873,6877,6890,6906,6928,6932,6945,6961,6986,6996,7012,7023],{"__ignoreMap":3088},[3092,6793,6794,6796,6798,6800,6802,6804,6806,6808,6810],{"class":3094,"line":3095},[3092,6795,3099],{"class":3098},[3092,6797,3103],{"class":3102},[3092,6799,3107],{"class":3106},[3092,6801,3111],{"class":3110},[3092,6803,3115],{"class":3114},[3092,6805,3118],{"class":3106},[3092,6807,3111],{"class":3110},[3092,6809,4187],{"class":3114},[3092,6811,3126],{"class":3098},[3092,6813,6814,6816,6818,6820,6822,6825,6827,6829,6831,6833,6835,6837],{"class":3094,"line":3129},[3092,6815,3132],{"class":3098},[3092,6817,3197],{"class":3102},[3092,6819,3504],{"class":3106},[3092,6821,3111],{"class":3110},[3092,6823,6824],{"class":3114},"\"Визначений прогрес (завjs 60%):\"",[3092,6826,6491],{"class":3106},[3092,6828,3111],{"class":3110},[3092,6830,3518],{"class":3114},[3092,6832,3837],{"class":3106},[3092,6834,3111],{"class":3110},[3092,6836,3123],{"class":3114},[3092,6838,3189],{"class":3098},[3092,6840,6841,6843,6845,6847,6849,6851,6853,6855,6857,6859,6861,6864,6866,6868,6871],{"class":3094,"line":3145},[3092,6842,3132],{"class":3098},[3092,6844,2978],{"class":3102},[3092,6846,6512],{"class":3106},[3092,6848,3111],{"class":3110},[3092,6850,6517],{"class":3114},[3092,6852,6520],{"class":3106},[3092,6854,3111],{"class":3110},[3092,6856,6525],{"class":3114},[3092,6858,6528],{"class":3106},[3092,6860,3111],{"class":3110},[3092,6862,6863],{"class":3114},"\"60\"",[3092,6865,3959],{"class":3106},[3092,6867,3111],{"class":3110},[3092,6869,6870],{"class":3114},"\"10\"",[3092,6872,3189],{"class":3098},[3092,6874,6875],{"class":3094,"line":3156},[3092,6876,3318],{"emptyLinePlaceholder":3317},[3092,6878,6879,6881,6883,6885,6887],{"class":3094,"line":3167},[3092,6880,3132],{"class":3098},[3092,6882,3197],{"class":3102},[3092,6884,3504],{"class":3106},[3092,6886,3111],{"class":3110},[3092,6888,6889],{"class":3114},"\"Невизначений прогрес (IsIndeterminate=True):\"\n",[3092,6891,6892,6894,6896,6898,6900,6902,6904],{"class":3094,"line":3178},[3092,6893,3221],{"class":3106},[3092,6895,3111],{"class":3110},[3092,6897,3518],{"class":3114},[3092,6899,3837],{"class":3106},[3092,6901,3111],{"class":3110},[3092,6903,3123],{"class":3114},[3092,6905,3189],{"class":3098},[3092,6907,6908,6910,6912,6915,6917,6920,6922,6924,6926],{"class":3094,"line":3192},[3092,6909,3132],{"class":3098},[3092,6911,2978],{"class":3102},[3092,6913,6914],{"class":3106}," IsIndeterminate",[3092,6916,3111],{"class":3110},[3092,6918,6919],{"class":3114},"\"True\"",[3092,6921,3959],{"class":3106},[3092,6923,3111],{"class":3110},[3092,6925,6870],{"class":3114},[3092,6927,3189],{"class":3098},[3092,6929,6930],{"class":3094,"line":3207},[3092,6931,3318],{"emptyLinePlaceholder":3317},[3092,6933,6934,6936,6938,6940,6942],{"class":3094,"line":3218},[3092,6935,3132],{"class":3098},[3092,6937,3197],{"class":3102},[3092,6939,3504],{"class":3106},[3092,6941,3111],{"class":3110},[3092,6943,6944],{"class":3114},"\"Вертикальний (Orientation=Vertical, 70%):\"\n",[3092,6946,6947,6949,6951,6953,6955,6957,6959],{"class":3094,"line":3229},[3092,6948,3221],{"class":3106},[3092,6950,3111],{"class":3110},[3092,6952,3518],{"class":3114},[3092,6954,3837],{"class":3106},[3092,6956,3111],{"class":3110},[3092,6958,3123],{"class":3114},[3092,6960,3189],{"class":3098},[3092,6962,6963,6965,6967,6969,6971,6973,6975,6977,6979,6981,6983],{"class":3094,"line":3242},[3092,6964,3132],{"class":3098},[3092,6966,2978],{"class":3102},[3092,6968,6512],{"class":3106},[3092,6970,3111],{"class":3110},[3092,6972,6517],{"class":3114},[3092,6974,6520],{"class":3106},[3092,6976,3111],{"class":3110},[3092,6978,6525],{"class":3114},[3092,6980,6528],{"class":3106},[3092,6982,3111],{"class":3110},[3092,6984,6985],{"class":3114},"\"70\"\n",[3092,6987,6988,6991,6993],{"class":3094,"line":3381},[3092,6989,6990],{"class":3106},"               Orientation",[3092,6992,3111],{"class":3110},[3092,6994,6995],{"class":3114},"\"Vertical\"\n",[3092,6997,6998,7001,7003,7005,7007,7009],{"class":3094,"line":3657},[3092,6999,7000],{"class":3106},"               Width",[3092,7002,3111],{"class":3110},[3092,7004,3115],{"class":3114},[3092,7006,3959],{"class":3106},[3092,7008,3111],{"class":3110},[3092,7010,7011],{"class":3114},"\"100\"\n",[3092,7013,7014,7017,7019,7021],{"class":3094,"line":3666},[3092,7015,7016],{"class":3106},"               HorizontalAlignment",[3092,7018,3111],{"class":3110},[3092,7020,3542],{"class":3114},[3092,7022,3189],{"class":3098},[3092,7024,7025,7027,7029],{"class":3094,"line":3675},[3092,7026,3245],{"class":3098},[3092,7028,3103],{"class":3102},[3092,7030,3126],{"class":3098},[2955,7032,7033,7034,7036],{},"Превью використовує Avalonia Fluent Theme. Анімація ",[2963,7035,2997],{}," може виглядати інакше, ніж у реальному WPF — Avalonia використовує \"pulse\" (пульсуючий блок), тоді як стандартний WPF показує рухому смугу типу \"серпантин\". У WPF з підключеними бібліотеками тем (наприклад, MahApps.Metro або ModernWPF) анімація також відрізняється. Поведінковий контракт — однаковий.",[3056,7038,7040],{"id":7039},"типові-помилки-при-роботі-з-progressbar","Типові помилки при роботі з ProgressBar",[3014,7042,7043,7044,7046],{},"Попри очевидну простоту ",[2963,7045,2978],{},", є кілька поширених помилок, на які варто звернути увагу ще до того, як ви з ними зіткнетесь на практиці.",[3014,7048,7049,7052,7053,7056,7057,7060,7061,7063,7064,7067,7068,7070,7071,7073,7074,7077],{},[2958,7050,7051],{},"Помилка 1: оновлення Value у головному потоці під час тривалої операції."," Якщо ви запускаєте важку обробку безпосередньо у обробнику події ",[2963,7054,7055],{},"Button_Click",", не в ",[2963,7058,7059],{},"Task.Run",", то і UI-потік зайнятий, і ",[2963,7062,2978],{}," не встигає перерисуватись — ви побачите або \"заморожений\" прогрес, або взагалі нічого. Правильне рішення — виконувати важку роботу у фоновому потоці (",[2963,7065,7066],{},"async/await"," + ",[2963,7069,7059],{},"), а оновлення ",[2963,7072,6355],{}," — через ",[2963,7075,7076],{},"Dispatcher.InvokeAsync"," або через прив'язку даних до ViewModel.",[3014,7079,7080,7086,7087,7090,7091,7093,7094,7097,7098,7100],{},[2958,7081,7082,7083,3007],{},"Помилка 2: встановлення Value поза межами ",[3092,7084,7085],{},"Minimum, Maximum"," Якщо ",[2963,7088,7089],{},"Value > Maximum"," — WPF автоматично \"зафіксує\" значення на ",[2963,7092,6365],{},", прогресбар буде показувати 100%, але виключення кинуто не буде. Якщо ",[2963,7095,7096],{},"Value \u003C Minimum"," — аналогічно, фіксується на ",[2963,7099,6362],{},". Це може замаскувати логічні помилки у коді підрахунку прогресу.",[3014,7102,7103,2961,7106,7108,7109,7112,7113,7115,7116,7119,7120,7122,7123,7126],{},[2958,7104,7105],{},"Помилка 3: недострілений розмір.",[2963,7107,2978],{}," за замовчуванням розтягується на всю ширину батьківського контейнера (",[2963,7110,7111],{},"HorizontalAlignment=\"Stretch\"","). У ",[2963,7114,3103],{}," зі скромними розмірами це призводить до несподівано вузького прогрес-бару. Встановіть явний ",[2963,7117,7118],{},"Width"," або розташуйте ",[2963,7121,2978],{}," у ",[2963,7124,7125],{},"Grid","-ячейці.",[3049,7128],{},[3009,7130,7132],{"id":7131},"slider-повзунок-для-вибору-числового-значення","Slider: повзунок для вибору числового значення",[3056,7134,7136],{"id":7135},"концептуальна-модель-slider","Концептуальна модель Slider",[3014,7138,7139,7141,7142,7144,7145,7147,7148,2966,7150,4050,7152,7154,7155,7157,7158,7160],{},[2963,7140,2981],{}," — це контрол, що дозволяє користувачу вибрати числове значення у заданому діапазоні шляхом перетягування повзунка (thumb) уздовж доріжки (track). Подібно до ",[2963,7143,2978],{},", він успадковує від ",[2963,7146,6340],{},", тому логіка ",[2963,7149,6362],{},[2963,7151,6365],{},[2963,7153,6355],{}," тотожня. Різниця принципова в одному: ",[2963,7156,2978],{}," — пасивний індикатор (не передбачає взаємодії), а ",[2963,7159,2981],{}," — активний елемент введення, що реагує на дії миші та клавіатури.",[3014,7162,7163,7164,7166],{},"Аналогія з реального світу: регулятор гучності на підсилювачі або \"крутилка\" яскравості монітора. Ви бачите поточне положення та можете плавно змінювати значення у визначених межах. Саме такий UX-паттерн реалізує ",[2963,7165,2981],{}," у WPF.",[3014,7168,7169,7170,7172],{},"З точки зору взаємодії ",[2963,7171,2981],{}," підтримує кілька способів зміни значення:",[7174,7175,7176,7183,7193,7208,7222],"ul",{},[7177,7178,7179,7182],"li",{},[2958,7180,7181],{},"Перетягування"," thumb мишею — зміна на будь-яку величину у межах діапазону.",[7177,7184,7185,7188,7189,7192],{},[2958,7186,7187],{},"Клік на доріжку"," — стрибок на значення ",[2963,7190,7191],{},"LargeChange"," у відповідному напрямку.",[7177,7194,7195,2961,7198,2961,7201,7204,7205,3007],{},[2958,7196,7197],{},"Клавіші стрілок",[3434,7199],{"value":7200},"←",[3434,7202],{"value":7203},"→"," — зміна на значення ",[2963,7206,7207],{},"SmallChange",[7177,7209,7210,2961,7213,7216,7217,7204,7220,3007],{},[2958,7211,7212],{},"Клавіші",[3434,7214],{"value":7215},"Page Up"," / ",[3434,7218],{"value":7219},"Page Down",[2963,7221,7191],{},[7177,7223,7224,2961,7226,7216,7229,7232,7233,7216,7235,3007],{},[2958,7225,7212],{},[3434,7227],{"value":7228},"Home",[3434,7230],{"value":7231},"End"," — стрибок до ",[2963,7234,6362],{},[2963,7236,6365],{},[3056,7238,7240],{"id":7239},"ключові-властивості-slider","Ключові властивості Slider",[4139,7242,7243,7265,7283,7294,7303,7315],{},[4142,7244,7246,7247,2966,7249,2966,7252,7255,7256,7259,7260,7262,7263,3007],{"name":7245,"type":6356},"TickFrequency","З якою частотою розміщувати мітки (tick marks) уздовж доріжки. Якщо ",[2963,7248,6435],{},[2963,7250,7251],{},"Maximum=100",[2963,7253,7254],{},"TickFrequency=10"," — мітки будуть на позиціях 0, 10, 20, ... 100. За замовчуванням — ",[2963,7257,7258],{},"1",". Мітки відображаються лише якщо ",[2963,7261,3000],{}," ≠ ",[2963,7264,5461],{},[4142,7266,7267,7268,7270,7271,7274,7275,7278,7279,7282],{"name":3000,"type":3000},"Де відображати мітки відносно доріжки: ",[2963,7269,5461],{}," (не відображати, за замовчуванням), ",[2963,7272,7273],{},"TopLeft"," (зверху для горизонтального / ліворуч для вертикального), ",[2963,7276,7277],{},"BottomRight"," (знизу / праворуч), ",[2963,7280,7281],{},"Both"," (з обох боків).",[4142,7284,6398,7285,7287,7288,7290,7291,7293],{"name":3003,"type":6397},[2963,7286,3431],{}," — thumb \"прилипає\" до найближчої мітки при перетягуванні. Значення ",[2963,7289,6355],{}," буде завжди кратне ",[2963,7292,7245],{},", ніколи не буде \"між мітками\". Зручно для налаштувань з дискретними значеннями (наприклад, вибір роздільної здатності або розміру шрифту).",[4142,7295,7296,7297,7300,7301,3007],{"name":7207,"type":6356},"Величина зміни значення при натисканні клавіш стрілок. За замовчуванням — ",[2963,7298,7299],{},"0.1",". Для цілочисельних Slider рекомендується встановити ",[2963,7302,7258],{},[4142,7304,7305,7306,7216,7308,6366,7310,7312,7313,3007],{"name":7191,"type":6356},"Величина зміни значення при кліку на доріжку або натисканні ",[3434,7307],{"value":7215},[3434,7309],{"value":7219},[2963,7311,7258],{},". Зазвичай у 10 разів більше за ",[2963,7314,7207],{},[4142,7316,7317,7319,7320,7322],{"name":6413,"type":6413},[2963,7318,6417],{}," (за замовчуванням) або ",[2963,7321,6421],{},". Для вертикального значення зростають знизу вгору.",[3056,7324,7326],{"id":7325},"базовий-slider-без-привязки","Базовий Slider без прив'язки",[3014,7328,7329],{},"Розпочнемо з найпростішого прикладу — горизонтального Slider з відображенням міток:",[3079,7331,7333],{"title":7332},"Slider: базові властивості та мітки",[3083,7334,7336],{"className":3085,"code":7335,"language":3087,"meta":3088,"style":3088},"\u003CStackPanel Margin=\"20\" Spacing=\"20\">\n  \u003CTextBlock Text=\"Основний Slider з мітками:\" Foreground=\"Gray\" FontSize=\"13\"/>\n  \u003CSlider Minimum=\"0\" Maximum=\"100\"\n          Value=\"40\"\n          TickFrequency=\"10\"\n          TickPlacement=\"BottomRight\"\n          SmallChange=\"1\"\n          LargeChange=\"10\"\n          Width=\"300\"\n          HorizontalAlignment=\"Left\"/>\n\n  \u003CTextBlock Text=\"IsSnapToTickEnabled=True (кроки по 25):\" Foreground=\"Gray\" FontSize=\"13\"/>\n  \u003CSlider Minimum=\"0\" Maximum=\"100\"\n          Value=\"50\"\n          TickFrequency=\"25\"\n          TickPlacement=\"Both\"\n          IsSnapToTickEnabled=\"True\"\n          SmallChange=\"25\"\n          LargeChange=\"25\"\n          Width=\"300\"\n          HorizontalAlignment=\"Left\"/>\n\n  \u003CTextBlock Text=\"Вертикальний Slider:\" Foreground=\"Gray\" FontSize=\"13\"/>\n  \u003CSlider Minimum=\"0\" Maximum=\"100\"\n          Value=\"65\"\n          Orientation=\"Vertical\"\n          TickFrequency=\"20\"\n          TickPlacement=\"BottomRight\"\n          Height=\"150\"\n          HorizontalAlignment=\"Left\"/>\n\u003C/StackPanel>\n",[2963,7337,7338,7358,7385,7403,7413,7423,7433,7443,7452,7461,7471,7475,7502,7520,7529,7538,7547,7556,7564,7572,7580,7590,7594,7621,7639,7648,7658,7668,7677,7688,7699],{"__ignoreMap":3088},[3092,7339,7340,7342,7344,7346,7348,7350,7352,7354,7356],{"class":3094,"line":3095},[3092,7341,3099],{"class":3098},[3092,7343,3103],{"class":3102},[3092,7345,3107],{"class":3106},[3092,7347,3111],{"class":3110},[3092,7349,3115],{"class":3114},[3092,7351,3118],{"class":3106},[3092,7353,3111],{"class":3110},[3092,7355,3115],{"class":3114},[3092,7357,3126],{"class":3098},[3092,7359,7360,7362,7364,7366,7368,7371,7373,7375,7377,7379,7381,7383],{"class":3094,"line":3129},[3092,7361,3132],{"class":3098},[3092,7363,3197],{"class":3102},[3092,7365,3504],{"class":3106},[3092,7367,3111],{"class":3110},[3092,7369,7370],{"class":3114},"\"Основний Slider з мітками:\"",[3092,7372,6491],{"class":3106},[3092,7374,3111],{"class":3110},[3092,7376,3518],{"class":3114},[3092,7378,3837],{"class":3106},[3092,7380,3111],{"class":3110},[3092,7382,4694],{"class":3114},[3092,7384,3189],{"class":3098},[3092,7386,7387,7389,7391,7393,7395,7397,7399,7401],{"class":3094,"line":3145},[3092,7388,3132],{"class":3098},[3092,7390,2981],{"class":3102},[3092,7392,6512],{"class":3106},[3092,7394,3111],{"class":3110},[3092,7396,6517],{"class":3114},[3092,7398,6520],{"class":3106},[3092,7400,3111],{"class":3110},[3092,7402,7011],{"class":3114},[3092,7404,7405,7408,7410],{"class":3094,"line":3156},[3092,7406,7407],{"class":3106},"          Value",[3092,7409,3111],{"class":3110},[3092,7411,7412],{"class":3114},"\"40\"\n",[3092,7414,7415,7418,7420],{"class":3094,"line":3167},[3092,7416,7417],{"class":3106},"          TickFrequency",[3092,7419,3111],{"class":3110},[3092,7421,7422],{"class":3114},"\"10\"\n",[3092,7424,7425,7428,7430],{"class":3094,"line":3178},[3092,7426,7427],{"class":3106},"          TickPlacement",[3092,7429,3111],{"class":3110},[3092,7431,7432],{"class":3114},"\"BottomRight\"\n",[3092,7434,7435,7438,7440],{"class":3094,"line":3192},[3092,7436,7437],{"class":3106},"          SmallChange",[3092,7439,3111],{"class":3110},[3092,7441,7442],{"class":3114},"\"1\"\n",[3092,7444,7445,7448,7450],{"class":3094,"line":3207},[3092,7446,7447],{"class":3106},"          LargeChange",[3092,7449,3111],{"class":3110},[3092,7451,7422],{"class":3114},[3092,7453,7454,7457,7459],{"class":3094,"line":3218},[3092,7455,7456],{"class":3106},"          Width",[3092,7458,3111],{"class":3110},[3092,7460,4273],{"class":3114},[3092,7462,7463,7465,7467,7469],{"class":3094,"line":3229},[3092,7464,3170],{"class":3106},[3092,7466,3111],{"class":3110},[3092,7468,3542],{"class":3114},[3092,7470,3189],{"class":3098},[3092,7472,7473],{"class":3094,"line":3242},[3092,7474,3318],{"emptyLinePlaceholder":3317},[3092,7476,7477,7479,7481,7483,7485,7488,7490,7492,7494,7496,7498,7500],{"class":3094,"line":3381},[3092,7478,3132],{"class":3098},[3092,7480,3197],{"class":3102},[3092,7482,3504],{"class":3106},[3092,7484,3111],{"class":3110},[3092,7486,7487],{"class":3114},"\"IsSnapToTickEnabled=True (кроки по 25):\"",[3092,7489,6491],{"class":3106},[3092,7491,3111],{"class":3110},[3092,7493,3518],{"class":3114},[3092,7495,3837],{"class":3106},[3092,7497,3111],{"class":3110},[3092,7499,4694],{"class":3114},[3092,7501,3189],{"class":3098},[3092,7503,7504,7506,7508,7510,7512,7514,7516,7518],{"class":3094,"line":3657},[3092,7505,3132],{"class":3098},[3092,7507,2981],{"class":3102},[3092,7509,6512],{"class":3106},[3092,7511,3111],{"class":3110},[3092,7513,6517],{"class":3114},[3092,7515,6520],{"class":3106},[3092,7517,3111],{"class":3110},[3092,7519,7011],{"class":3114},[3092,7521,7522,7524,7526],{"class":3094,"line":3666},[3092,7523,7407],{"class":3106},[3092,7525,3111],{"class":3110},[3092,7527,7528],{"class":3114},"\"50\"\n",[3092,7530,7531,7533,7535],{"class":3094,"line":3675},[3092,7532,7417],{"class":3106},[3092,7534,3111],{"class":3110},[3092,7536,7537],{"class":3114},"\"25\"\n",[3092,7539,7540,7542,7544],{"class":3094,"line":3687},[3092,7541,7427],{"class":3106},[3092,7543,3111],{"class":3110},[3092,7545,7546],{"class":3114},"\"Both\"\n",[3092,7548,7549,7552,7554],{"class":3094,"line":3697},[3092,7550,7551],{"class":3106},"          IsSnapToTickEnabled",[3092,7553,3111],{"class":3110},[3092,7555,3600],{"class":3114},[3092,7557,7558,7560,7562],{"class":3094,"line":4019},[3092,7559,7437],{"class":3106},[3092,7561,3111],{"class":3110},[3092,7563,7537],{"class":3114},[3092,7565,7566,7568,7570],{"class":3094,"line":4028},[3092,7567,7447],{"class":3106},[3092,7569,3111],{"class":3110},[3092,7571,7537],{"class":3114},[3092,7573,7574,7576,7578],{"class":3094,"line":4037},[3092,7575,7456],{"class":3106},[3092,7577,3111],{"class":3110},[3092,7579,4273],{"class":3114},[3092,7581,7582,7584,7586,7588],{"class":3094,"line":4438},[3092,7583,3170],{"class":3106},[3092,7585,3111],{"class":3110},[3092,7587,3542],{"class":3114},[3092,7589,3189],{"class":3098},[3092,7591,7592],{"class":3094,"line":4447},[3092,7593,3318],{"emptyLinePlaceholder":3317},[3092,7595,7596,7598,7600,7602,7604,7607,7609,7611,7613,7615,7617,7619],{"class":3094,"line":4456},[3092,7597,3132],{"class":3098},[3092,7599,3197],{"class":3102},[3092,7601,3504],{"class":3106},[3092,7603,3111],{"class":3110},[3092,7605,7606],{"class":3114},"\"Вертикальний Slider:\"",[3092,7608,6491],{"class":3106},[3092,7610,3111],{"class":3110},[3092,7612,3518],{"class":3114},[3092,7614,3837],{"class":3106},[3092,7616,3111],{"class":3110},[3092,7618,4694],{"class":3114},[3092,7620,3189],{"class":3098},[3092,7622,7623,7625,7627,7629,7631,7633,7635,7637],{"class":3094,"line":4468},[3092,7624,3132],{"class":3098},[3092,7626,2981],{"class":3102},[3092,7628,6512],{"class":3106},[3092,7630,3111],{"class":3110},[3092,7632,6517],{"class":3114},[3092,7634,6520],{"class":3106},[3092,7636,3111],{"class":3110},[3092,7638,7011],{"class":3114},[3092,7640,7641,7643,7645],{"class":3094,"line":4477},[3092,7642,7407],{"class":3106},[3092,7644,3111],{"class":3110},[3092,7646,7647],{"class":3114},"\"65\"\n",[3092,7649,7651,7654,7656],{"class":3094,"line":7650},26,[3092,7652,7653],{"class":3106},"          Orientation",[3092,7655,3111],{"class":3110},[3092,7657,6995],{"class":3114},[3092,7659,7661,7663,7665],{"class":3094,"line":7660},27,[3092,7662,7417],{"class":3106},[3092,7664,3111],{"class":3110},[3092,7666,7667],{"class":3114},"\"20\"\n",[3092,7669,7671,7673,7675],{"class":3094,"line":7670},28,[3092,7672,7427],{"class":3106},[3092,7674,3111],{"class":3110},[3092,7676,7432],{"class":3114},[3092,7678,7680,7683,7685],{"class":3094,"line":7679},29,[3092,7681,7682],{"class":3106},"          Height",[3092,7684,3111],{"class":3110},[3092,7686,7687],{"class":3114},"\"150\"\n",[3092,7689,7691,7693,7695,7697],{"class":3094,"line":7690},30,[3092,7692,3170],{"class":3106},[3092,7694,3111],{"class":3110},[3092,7696,3542],{"class":3114},[3092,7698,3189],{"class":3098},[3092,7700,7702,7704,7706],{"class":3094,"line":7701},31,[3092,7703,3245],{"class":3098},[3092,7705,3103],{"class":3102},[3092,7707,3126],{"class":3098},[3056,7709,7711],{"id":7710},"привязка-slider-до-textblock-через-elementname","Прив'язка Slider до TextBlock через ElementName",[3014,7713,7714,7715,3441,7717,7719,7720,7723],{},"Одна з найнаочніших демонстрацій прив'язки даних у WPF — синхронізація ",[2963,7716,2981],{},[2963,7718,3197],{}," без жодного рядка C#-коду. Ми вже познайомились із ",[2963,7721,7722],{},"{Binding ElementName}"," у статті про Markup Extensions — тепер застосуємо його на практиці.",[3014,7725,7726,7727,7730,7731,7733,7734,7736,7737,7739],{},"Ідея проста: ",[2963,7728,7729],{},"TextBlock.Text"," прив'язується до властивості ",[2963,7732,6355],{}," іменованого ",[2963,7735,2981],{},". Коли користувач переміщує повзун — ",[2963,7738,3197],{}," миттєво оновлюється. Це двонаправлена синхронізація лише через XAML, без code-behind:",[3079,7741,7743],{"title":7742},"Slider + TextBlock: прив'язка через ElementName",[3083,7744,7746],{"className":3085,"code":7745,"language":3087,"meta":3088,"style":3088},"\u003CStackPanel Margin=\"20\" Spacing=\"16\">\n  \u003CTextBlock Text=\"Оберіть розмір шрифту:\" Foreground=\"Gray\" FontSize=\"13\"/>\n\n  \u003CSlider x:Name=\"fontSizeSlider\"\n          Minimum=\"8\" Maximum=\"48\"\n          Value=\"16\"\n          TickFrequency=\"4\"\n          TickPlacement=\"BottomRight\"\n          IsSnapToTickEnabled=\"True\"\n          SmallChange=\"4\"\n          LargeChange=\"8\"\n          Width=\"300\"\n          HorizontalAlignment=\"Left\"/>\n\n  \u003CStackPanel Orientation=\"Horizontal\" Spacing=\"8\">\n    \u003CTextBlock Text=\"Поточний розмір: \" Foreground=\"Gray\"/>\n    \u003CTextBlock Text=\"{Binding ElementName=fontSizeSlider, Path=Value}\"\n               FontWeight=\"Bold\"/>\n    \u003CTextBlock Text=\"px\" Foreground=\"Gray\"/>\n  \u003C/StackPanel>\n\n  \u003CTextBlock Text=\"Зразок тексту\"\n             FontSize=\"{Binding ElementName=fontSizeSlider, Path=Value}\"\n             FontWeight=\"Medium\"\n             Foreground=\"#6366F1\"/>\n\u003C/StackPanel>\n",[2963,7747,7748,7768,7795,7799,7812,7828,7836,7845,7853,7861,7869,7878,7886,7896,7900,7920,7941,7954,7965,7986,7994,7998,8011,8019,8029,8040],{"__ignoreMap":3088},[3092,7749,7750,7752,7754,7756,7758,7760,7762,7764,7766],{"class":3094,"line":3095},[3092,7751,3099],{"class":3098},[3092,7753,3103],{"class":3102},[3092,7755,3107],{"class":3106},[3092,7757,3111],{"class":3110},[3092,7759,3115],{"class":3114},[3092,7761,3118],{"class":3106},[3092,7763,3111],{"class":3110},[3092,7765,4187],{"class":3114},[3092,7767,3126],{"class":3098},[3092,7769,7770,7772,7774,7776,7778,7781,7783,7785,7787,7789,7791,7793],{"class":3094,"line":3129},[3092,7771,3132],{"class":3098},[3092,7773,3197],{"class":3102},[3092,7775,3504],{"class":3106},[3092,7777,3111],{"class":3110},[3092,7779,7780],{"class":3114},"\"Оберіть розмір шрифту:\"",[3092,7782,6491],{"class":3106},[3092,7784,3111],{"class":3110},[3092,7786,3518],{"class":3114},[3092,7788,3837],{"class":3106},[3092,7790,3111],{"class":3110},[3092,7792,4694],{"class":3114},[3092,7794,3189],{"class":3098},[3092,7796,7797],{"class":3094,"line":3145},[3092,7798,3318],{"emptyLinePlaceholder":3317},[3092,7800,7801,7803,7805,7807,7809],{"class":3094,"line":3156},[3092,7802,3132],{"class":3098},[3092,7804,2981],{"class":3102},[3092,7806,3137],{"class":3106},[3092,7808,3111],{"class":3110},[3092,7810,7811],{"class":3114},"\"fontSizeSlider\"\n",[3092,7813,7814,7817,7819,7821,7823,7825],{"class":3094,"line":3167},[3092,7815,7816],{"class":3106},"          Minimum",[3092,7818,3111],{"class":3110},[3092,7820,3573],{"class":3114},[3092,7822,6520],{"class":3106},[3092,7824,3111],{"class":3110},[3092,7826,7827],{"class":3114},"\"48\"\n",[3092,7829,7830,7832,7834],{"class":3094,"line":3178},[3092,7831,7407],{"class":3106},[3092,7833,3111],{"class":3110},[3092,7835,3215],{"class":3114},[3092,7837,7838,7840,7842],{"class":3094,"line":3192},[3092,7839,7417],{"class":3106},[3092,7841,3111],{"class":3110},[3092,7843,7844],{"class":3114},"\"4\"\n",[3092,7846,7847,7849,7851],{"class":3094,"line":3207},[3092,7848,7427],{"class":3106},[3092,7850,3111],{"class":3110},[3092,7852,7432],{"class":3114},[3092,7854,7855,7857,7859],{"class":3094,"line":3218},[3092,7856,7551],{"class":3106},[3092,7858,3111],{"class":3110},[3092,7860,3600],{"class":3114},[3092,7862,7863,7865,7867],{"class":3094,"line":3229},[3092,7864,7437],{"class":3106},[3092,7866,3111],{"class":3110},[3092,7868,7844],{"class":3114},[3092,7870,7871,7873,7875],{"class":3094,"line":3242},[3092,7872,7447],{"class":3106},[3092,7874,3111],{"class":3110},[3092,7876,7877],{"class":3114},"\"8\"\n",[3092,7879,7880,7882,7884],{"class":3094,"line":3381},[3092,7881,7456],{"class":3106},[3092,7883,3111],{"class":3110},[3092,7885,4273],{"class":3114},[3092,7887,7888,7890,7892,7894],{"class":3094,"line":3657},[3092,7889,3170],{"class":3106},[3092,7891,3111],{"class":3110},[3092,7893,3542],{"class":3114},[3092,7895,3189],{"class":3098},[3092,7897,7898],{"class":3094,"line":3666},[3092,7899,3318],{"emptyLinePlaceholder":3317},[3092,7901,7902,7904,7906,7908,7910,7912,7914,7916,7918],{"class":3094,"line":3675},[3092,7903,3132],{"class":3098},[3092,7905,3103],{"class":3102},[3092,7907,3561],{"class":3106},[3092,7909,3111],{"class":3110},[3092,7911,3566],{"class":3114},[3092,7913,3118],{"class":3106},[3092,7915,3111],{"class":3110},[3092,7917,3573],{"class":3114},[3092,7919,3126],{"class":3098},[3092,7921,7922,7924,7926,7928,7930,7933,7935,7937,7939],{"class":3094,"line":3687},[3092,7923,3580],{"class":3098},[3092,7925,3197],{"class":3102},[3092,7927,3504],{"class":3106},[3092,7929,3111],{"class":3110},[3092,7931,7932],{"class":3114},"\"Поточний розмір: \"",[3092,7934,6491],{"class":3106},[3092,7936,3111],{"class":3110},[3092,7938,3518],{"class":3114},[3092,7940,3189],{"class":3098},[3092,7942,7943,7945,7947,7949,7951],{"class":3094,"line":3697},[3092,7944,3580],{"class":3098},[3092,7946,3197],{"class":3102},[3092,7948,3504],{"class":3106},[3092,7950,3111],{"class":3110},[3092,7952,7953],{"class":3114},"\"{Binding ElementName=fontSizeSlider, Path=Value}\"\n",[3092,7955,7956,7959,7961,7963],{"class":3094,"line":4019},[3092,7957,7958],{"class":3106},"               FontWeight",[3092,7960,3111],{"class":3110},[3092,7962,5546],{"class":3114},[3092,7964,3189],{"class":3098},[3092,7966,7967,7969,7971,7973,7975,7978,7980,7982,7984],{"class":3094,"line":4028},[3092,7968,3580],{"class":3098},[3092,7970,3197],{"class":3102},[3092,7972,3504],{"class":3106},[3092,7974,3111],{"class":3110},[3092,7976,7977],{"class":3114},"\"px\"",[3092,7979,6491],{"class":3106},[3092,7981,3111],{"class":3110},[3092,7983,3518],{"class":3114},[3092,7985,3189],{"class":3098},[3092,7987,7988,7990,7992],{"class":3094,"line":4037},[3092,7989,3690],{"class":3098},[3092,7991,3103],{"class":3102},[3092,7993,3126],{"class":3098},[3092,7995,7996],{"class":3094,"line":4438},[3092,7997,3318],{"emptyLinePlaceholder":3317},[3092,7999,8000,8002,8004,8006,8008],{"class":3094,"line":4447},[3092,8001,3132],{"class":3098},[3092,8003,3197],{"class":3102},[3092,8005,3504],{"class":3106},[3092,8007,3111],{"class":3110},[3092,8009,8010],{"class":3114},"\"Зразок тексту\"\n",[3092,8012,8013,8015,8017],{"class":3094,"line":4456},[3092,8014,3210],{"class":3106},[3092,8016,3111],{"class":3110},[3092,8018,7953],{"class":3114},[3092,8020,8021,8024,8026],{"class":3094,"line":4468},[3092,8022,8023],{"class":3106},"             FontWeight",[3092,8025,3111],{"class":3110},[3092,8027,8028],{"class":3114},"\"Medium\"\n",[3092,8030,8031,8033,8035,8038],{"class":3094,"line":4477},[3092,8032,3221],{"class":3106},[3092,8034,3111],{"class":3110},[3092,8036,8037],{"class":3114},"\"#6366F1\"",[3092,8039,3189],{"class":3098},[3092,8041,8042,8044,8046],{"class":3094,"line":7650},[3092,8043,3245],{"class":3098},[3092,8045,3103],{"class":3102},[3092,8047,3126],{"class":3098},[3014,8049,8050,8051,8054,8055,8057,8058,8061,8062,8065,8066,8068,8069,8065,8071,8073,8074,8065,8076,8078,8079,8082,8083,8085],{},"Зверніть на ключові деталі цього прикладу. ",[2963,8052,8053],{},"x:Name=\"fontSizeSlider\""," — присвоює іменований ідентифікатор ",[2963,8056,2981],{},"-у в межах поточного XAML-дерева. Саме за цим ім'ям ",[2963,8059,8060],{},"{Binding ElementName=fontSizeSlider, Path=Value}"," знаходить джерело прив'язки. Прив'язка ",[2963,8063,8064],{},"FontSize"," до ",[2963,8067,6355],{}," (",[3029,8070,6356],{},[3029,8072,6356],{},") не потребує жодного конвертера — типи збігаються. А ось прив'язка ",[2963,8075,3364],{},[2963,8077,6355],{}," неявно застосовує стандартний ",[2963,8080,8081],{},"ToString()",", який перетворює ",[2963,8084,6356],{}," на рядок. Це автоматично.",[3041,8087,8088,8116,8125],{},[3014,8089,8090,8091,8094,8095,8097,8098,8101,8102,8104,8105,8108,8109,8112,8113,3077],{},"За замовчуванням ",[2963,8092,8093],{},"Slider.Value"," зберігає значення типу ",[2963,8096,6356],{}," з десятковою частиною (наприклад, ",[2963,8099,8100],{},"16.0","). Щоб ",[2963,8103,3197],{}," показував ",[2963,8106,8107],{},"16"," замість ",[2963,8110,8111],{},"16,0"," — скористайтесь ",[2963,8114,8115],{},"StringFormat",[3083,8117,8119],{"className":3085,"code":8118,"language":3087,"meta":3088,"style":3088},"Text=\"{Binding ElementName=fontSizeSlider, Path=Value, StringFormat={}{0:F0}}\"\n",[2963,8120,8121],{"__ignoreMap":3088},[3092,8122,8123],{"class":3094,"line":3095},[3092,8124,8118],{"class":3110},[3014,8126,8127,8130,8131,8134,8135,3007],{},[2963,8128,8129],{},"{0:F0}"," — формат з нульовою кількістю знаків після крапки. Або використовуйте ",[2963,8132,8133],{},"IsSnapToTickEnabled=\"True\""," — тоді значення завжди буде цілим згідно з ",[2963,8136,7245],{},[2955,8138,8139,8140,2966,8142,2966,8144,2966,8146,8149],{},"Превью використовує Avalonia Fluent Theme. Зовнішній вигляд thumb та track у реальному WPF буде іншим (класична тема Aero). Поведінкові властивості (",[2963,8141,7245],{},[2963,8143,3000],{},[2963,8145,3003],{},[2963,8147,8148],{},"ElementName","-прив'язка) — ідентичні в обох фреймворках.",[3049,8151],{},[3009,8153,8155],{"id":8154},"tooltip-спливаючі-підказки","ToolTip: спливаючі підказки",[3056,8157,8159],{"id":8158},"навіщо-потрібні-tooltip-і-коли-вони-доречні","Навіщо потрібні ToolTip і коли вони доречні",[3014,8161,8162,8163,8165],{},"Будь-який добре спроєктований інтерфейс передусім є зрозумілим. Але зрозумілість і стислість — це суперечливі вимоги: якщо пояснювати кожну кнопку написом, інтерфейс стане захаращеним; якщо нічого не пояснювати — незрозумілим. ",[2963,8164,2984],{}," вирішує цю дилему елегантно: він показує пояснення лише тоді, коли користувач затримує курсор миші над елементом — тобто тоді, коли він сам сигналізує про зацікавленість.",[3014,8167,8168,8169,8171,8172,8174,8175,8177],{},"У WPF ",[2963,8170,2984],{}," — це не просто властивість рядка, а повноцінний контрол. Він успадковує від ",[2963,8173,3727],{},", а отже, як і ",[2963,8176,2965],{},", може містити будь-який XAML-вміст. Це відкриває сценарії, недосяжні у WinForms: ToolTip із зображенням, ключами клавіатури, форматованим текстом або навіть цілою мініатюрою форми.",[3056,8179,8181],{"id":8180},"простий-текстовий-tooltip","Простий текстовий ToolTip",[3014,8183,8184,8185,8187],{},"Найпростіший спосіб додати підказку — встановити рядок у властивість ",[2963,8186,2984],{}," будь-якого елемента. WPF автоматично обгортає його у відповідний контрол:",[3079,8189,8191],{"title":8190},"ToolTip: простий текст на кнопках",[3083,8192,8194],{"className":3085,"code":8193,"language":3087,"meta":3088,"style":3088},"\u003CStackPanel Margin=\"20\" Spacing=\"16\">\n  \u003CTextBlock Text=\"Наведіть курсор на кнопки, щоб побачити підказки:\"\n             Foreground=\"Gray\" FontSize=\"13\"/>\n  \u003CWrapPanel ItemSpacing=\"8\">\n    \u003CButton Content=\"💾 Зберегти\"\n            Padding=\"12 6\"\n            ToolTip=\"Зберегти поточний документ (Ctrl+S)\"/>\n    \u003CButton Content=\"📂 Відкрити\"\n            Padding=\"12 6\"\n            ToolTip=\"Відкрити файл з диску (Ctrl+O)\"/>\n    \u003CButton Content=\"🖨 Друк\"\n            Padding=\"12 6\"\n            ToolTip=\"Надіслати документ на принтер (Ctrl+P)\"/>\n  \u003C/WrapPanel>\n\u003C/StackPanel>\n",[2963,8195,8196,8216,8229,8245,8261,8274,8283,8295,8308,8316,8327,8340,8348,8359,8367],{"__ignoreMap":3088},[3092,8197,8198,8200,8202,8204,8206,8208,8210,8212,8214],{"class":3094,"line":3095},[3092,8199,3099],{"class":3098},[3092,8201,3103],{"class":3102},[3092,8203,3107],{"class":3106},[3092,8205,3111],{"class":3110},[3092,8207,3115],{"class":3114},[3092,8209,3118],{"class":3106},[3092,8211,3111],{"class":3110},[3092,8213,4187],{"class":3114},[3092,8215,3126],{"class":3098},[3092,8217,8218,8220,8222,8224,8226],{"class":3094,"line":3129},[3092,8219,3132],{"class":3098},[3092,8221,3197],{"class":3102},[3092,8223,3504],{"class":3106},[3092,8225,3111],{"class":3110},[3092,8227,8228],{"class":3114},"\"Наведіть курсор на кнопки, щоб побачити підказки:\"\n",[3092,8230,8231,8233,8235,8237,8239,8241,8243],{"class":3094,"line":3145},[3092,8232,3221],{"class":3106},[3092,8234,3111],{"class":3110},[3092,8236,3518],{"class":3114},[3092,8238,3837],{"class":3106},[3092,8240,3111],{"class":3110},[3092,8242,4694],{"class":3114},[3092,8244,3189],{"class":3098},[3092,8246,8247,8249,8252,8255,8257,8259],{"class":3094,"line":3156},[3092,8248,3132],{"class":3098},[3092,8250,8251],{"class":3102},"WrapPanel",[3092,8253,8254],{"class":3106}," ItemSpacing",[3092,8256,3111],{"class":3110},[3092,8258,3573],{"class":3114},[3092,8260,3126],{"class":3098},[3092,8262,8263,8265,8267,8269,8271],{"class":3094,"line":3167},[3092,8264,3580],{"class":3098},[3092,8266,2965],{"class":3102},[3092,8268,3585],{"class":3106},[3092,8270,3111],{"class":3110},[3092,8272,8273],{"class":3114},"\"💾 Зберегти\"\n",[3092,8275,8276,8278,8280],{"class":3094,"line":3178},[3092,8277,3605],{"class":3106},[3092,8279,3111],{"class":3110},[3092,8281,8282],{"class":3114},"\"12 6\"\n",[3092,8284,8285,8288,8290,8293],{"class":3094,"line":3192},[3092,8286,8287],{"class":3106},"            ToolTip",[3092,8289,3111],{"class":3110},[3092,8291,8292],{"class":3114},"\"Зберегти поточний документ (Ctrl+S)\"",[3092,8294,3189],{"class":3098},[3092,8296,8297,8299,8301,8303,8305],{"class":3094,"line":3207},[3092,8298,3580],{"class":3098},[3092,8300,2965],{"class":3102},[3092,8302,3585],{"class":3106},[3092,8304,3111],{"class":3110},[3092,8306,8307],{"class":3114},"\"📂 Відкрити\"\n",[3092,8309,8310,8312,8314],{"class":3094,"line":3218},[3092,8311,3605],{"class":3106},[3092,8313,3111],{"class":3110},[3092,8315,8282],{"class":3114},[3092,8317,8318,8320,8322,8325],{"class":3094,"line":3229},[3092,8319,8287],{"class":3106},[3092,8321,3111],{"class":3110},[3092,8323,8324],{"class":3114},"\"Відкрити файл з диску (Ctrl+O)\"",[3092,8326,3189],{"class":3098},[3092,8328,8329,8331,8333,8335,8337],{"class":3094,"line":3242},[3092,8330,3580],{"class":3098},[3092,8332,2965],{"class":3102},[3092,8334,3585],{"class":3106},[3092,8336,3111],{"class":3110},[3092,8338,8339],{"class":3114},"\"🖨 Друк\"\n",[3092,8341,8342,8344,8346],{"class":3094,"line":3381},[3092,8343,3605],{"class":3106},[3092,8345,3111],{"class":3110},[3092,8347,8282],{"class":3114},[3092,8349,8350,8352,8354,8357],{"class":3094,"line":3657},[3092,8351,8287],{"class":3106},[3092,8353,3111],{"class":3110},[3092,8355,8356],{"class":3114},"\"Надіслати документ на принтер (Ctrl+P)\"",[3092,8358,3189],{"class":3098},[3092,8360,8361,8363,8365],{"class":3094,"line":3666},[3092,8362,3690],{"class":3098},[3092,8364,8251],{"class":3102},[3092,8366,3126],{"class":3098},[3092,8368,8369,8371,8373],{"class":3094,"line":3675},[3092,8370,3245],{"class":3098},[3092,8372,3103],{"class":3102},[3092,8374,3126],{"class":3098},[3014,8376,8377,8378,8381,8382,3441,8384,8387,8388,3077],{},"Зверніть: ",[2963,8379,8380],{},"ToolTip=\"...\""," — це скорочений запис. WPF за лаштунками перетворює рядок на об'єкт ",[2963,8383,2984],{},[2963,8385,8386],{},"Content = \"...\"",". Додаткові параметри (затримка показу, тривалість показу) можна регулювати через прикріплені властивості класу ",[2963,8389,8390],{},"ToolTipService",[4550,8392,8393,8407],{},[4553,8394,8395],{},[4556,8396,8397,8401,8404],{},[4559,8398,4979,8399],{},[2963,8400,8390],{},[4559,8402,8403],{},"За замовч.",[4559,8405,8406],{},"Опис",[4571,8408,8409,8422,8435,8448],{},[4556,8410,8411,8416,8419],{},[4576,8412,8413],{},[2963,8414,8415],{},"InitialShowDelay",[4576,8417,8418],{},"400 мс",[4576,8420,8421],{},"Час від наведення курсору до появи підказки",[4556,8423,8424,8429,8432],{},[4576,8425,8426],{},[2963,8427,8428],{},"ShowDuration",[4576,8430,8431],{},"5000 мс",[4576,8433,8434],{},"Час відображення підказки",[4556,8436,8437,8442,8445],{},[4576,8438,8439],{},[2963,8440,8441],{},"BetweenShowDelay",[4576,8443,8444],{},"100 мс",[4576,8446,8447],{},"Затримка між закриттям одного та відкриттям іншого ToolTip",[4556,8449,8450,8454,8459],{},[4576,8451,8452],{},[2963,8453,3006],{},[4576,8455,8456],{},[2963,8457,8458],{},"Mouse",[4576,8460,8461,8462,5062],{},"Відносно чого розміщувати (аналогічно до ",[2963,8463,8464],{},"Popup.Placement",[3056,8466,8468],{"id":8467},"складний-структурований-tooltip","Складний структурований ToolTip",[3014,8470,8471,8472,8474,8475,8478],{},"Коли простого рядка недостатньо — замінюємо атрибут ",[2963,8473,8380],{}," на елемент ",[2963,8476,8477],{},"\u003CX.ToolTip>\u003CToolTip>...\u003C/ToolTip>\u003C/X.ToolTip>"," і всередині розміщуємо довільний XAML. Це \"Typed ToolTip\" або \"Structured ToolTip\" — стандартний підхід у програмних продуктах:",[3079,8480,8482],{"title":8481},"ToolTip: структурований вміст з XAML",[3083,8483,8485],{"className":3085,"code":8484,"language":3087,"meta":3088,"style":3088},"\u003CStackPanel Margin=\"20\" Spacing=\"16\">\n  \u003CTextBlock Text=\"Наведіть курсор на кнопку для складної підказки:\"\n             Foreground=\"Gray\" FontSize=\"13\"/>\n  \u003CButton Content=\"⚙ Параметри\" Padding=\"12,8\" HorizontalAlignment=\"Left\">\n    \u003CButton.ToolTip>\n      \u003CToolTip MaxWidth=\"280\">\n        \u003CStackPanel Spacing=\"6\">\n          \u003CTextBlock Text=\"Параметри застосунку\"\n                     FontWeight=\"Bold\" FontSize=\"13\"/>\n          \u003CSeparator/>\n          \u003CTextBlock Text=\"Відкриває вікно з налаштуваннями виду, мови та з'єднання з базою даних.\"\n                     TextWrapping=\"Wrap\"\n                     Foreground=\"Gray\" FontSize=\"12\"/>\n          \u003CStackPanel Orientation=\"Horizontal\" Spacing=\"4\">\n            \u003CTextBlock Text=\"Клавіша:\" Foreground=\"Gray\" FontSize=\"11\"/>\n            \u003CBorder Background=\"#3C3C3C\" CornerRadius=\"3\" Padding=\"4,1\">\n              \u003CTextBlock Text=\"Ctrl+,\" FontSize=\"11\" Foreground=\"#E0E0E0\"/>\n            \u003C/Border>\n          \u003C/StackPanel>\n        \u003C/StackPanel>\n      \u003C/ToolTip>\n    \u003C/Button.ToolTip>\n  \u003C/Button>\n\u003C/StackPanel>\n",[2963,8486,8487,8507,8520,8536,8563,8572,8588,8604,8618,8635,8644,8657,8667,8684,8705,8733,8763,8792,8801,8810,8819,8828,8836,8844],{"__ignoreMap":3088},[3092,8488,8489,8491,8493,8495,8497,8499,8501,8503,8505],{"class":3094,"line":3095},[3092,8490,3099],{"class":3098},[3092,8492,3103],{"class":3102},[3092,8494,3107],{"class":3106},[3092,8496,3111],{"class":3110},[3092,8498,3115],{"class":3114},[3092,8500,3118],{"class":3106},[3092,8502,3111],{"class":3110},[3092,8504,4187],{"class":3114},[3092,8506,3126],{"class":3098},[3092,8508,8509,8511,8513,8515,8517],{"class":3094,"line":3129},[3092,8510,3132],{"class":3098},[3092,8512,3197],{"class":3102},[3092,8514,3504],{"class":3106},[3092,8516,3111],{"class":3110},[3092,8518,8519],{"class":3114},"\"Наведіть курсор на кнопку для складної підказки:\"\n",[3092,8521,8522,8524,8526,8528,8530,8532,8534],{"class":3094,"line":3145},[3092,8523,3221],{"class":3106},[3092,8525,3111],{"class":3110},[3092,8527,3518],{"class":3114},[3092,8529,3837],{"class":3106},[3092,8531,3111],{"class":3110},[3092,8533,4694],{"class":3114},[3092,8535,3189],{"class":3098},[3092,8537,8538,8540,8542,8544,8546,8549,8551,8553,8555,8557,8559,8561],{"class":3094,"line":3156},[3092,8539,3132],{"class":3098},[3092,8541,2965],{"class":3102},[3092,8543,3585],{"class":3106},[3092,8545,3111],{"class":3110},[3092,8547,8548],{"class":3114},"\"⚙ Параметри\"",[3092,8550,3545],{"class":3106},[3092,8552,3111],{"class":3110},[3092,8554,3798],{"class":3114},[3092,8556,3537],{"class":3106},[3092,8558,3111],{"class":3110},[3092,8560,3542],{"class":3114},[3092,8562,3126],{"class":3098},[3092,8564,8565,8567,8570],{"class":3094,"line":3167},[3092,8566,3580],{"class":3098},[3092,8568,8569],{"class":3102},"Button.ToolTip",[3092,8571,3126],{"class":3098},[3092,8573,8574,8576,8578,8581,8583,8586],{"class":3094,"line":3178},[3092,8575,3825],{"class":3098},[3092,8577,2984],{"class":3102},[3092,8579,8580],{"class":3106}," MaxWidth",[3092,8582,3111],{"class":3110},[3092,8584,8585],{"class":3114},"\"280\"",[3092,8587,3126],{"class":3098},[3092,8589,8590,8593,8595,8597,8599,8602],{"class":3094,"line":3192},[3092,8591,8592],{"class":3098},"        \u003C",[3092,8594,3103],{"class":3102},[3092,8596,3118],{"class":3106},[3092,8598,3111],{"class":3110},[3092,8600,8601],{"class":3114},"\"6\"",[3092,8603,3126],{"class":3098},[3092,8605,8606,8609,8611,8613,8615],{"class":3094,"line":3207},[3092,8607,8608],{"class":3098},"          \u003C",[3092,8610,3197],{"class":3102},[3092,8612,3504],{"class":3106},[3092,8614,3111],{"class":3110},[3092,8616,8617],{"class":3114},"\"Параметри застосунку\"\n",[3092,8619,8620,8623,8625,8627,8629,8631,8633],{"class":3094,"line":3218},[3092,8621,8622],{"class":3106},"                     FontWeight",[3092,8624,3111],{"class":3110},[3092,8626,5546],{"class":3114},[3092,8628,3837],{"class":3106},[3092,8630,3111],{"class":3110},[3092,8632,4694],{"class":3114},[3092,8634,3189],{"class":3098},[3092,8636,8637,8639,8642],{"class":3094,"line":3229},[3092,8638,8608],{"class":3098},[3092,8640,8641],{"class":3102},"Separator",[3092,8643,3189],{"class":3098},[3092,8645,8646,8648,8650,8652,8654],{"class":3094,"line":3242},[3092,8647,8608],{"class":3098},[3092,8649,3197],{"class":3102},[3092,8651,3504],{"class":3106},[3092,8653,3111],{"class":3110},[3092,8655,8656],{"class":3114},"\"Відкриває вікно з налаштуваннями виду, мови та з'єднання з базою даних.\"\n",[3092,8658,8659,8662,8664],{"class":3094,"line":3381},[3092,8660,8661],{"class":3106},"                     TextWrapping",[3092,8663,3111],{"class":3110},[3092,8665,8666],{"class":3114},"\"Wrap\"\n",[3092,8668,8669,8672,8674,8676,8678,8680,8682],{"class":3094,"line":3657},[3092,8670,8671],{"class":3106},"                     Foreground",[3092,8673,3111],{"class":3110},[3092,8675,3518],{"class":3114},[3092,8677,3837],{"class":3106},[3092,8679,3111],{"class":3110},[3092,8681,3123],{"class":3114},[3092,8683,3189],{"class":3098},[3092,8685,8686,8688,8690,8692,8694,8696,8698,8700,8703],{"class":3094,"line":3666},[3092,8687,8608],{"class":3098},[3092,8689,3103],{"class":3102},[3092,8691,3561],{"class":3106},[3092,8693,3111],{"class":3110},[3092,8695,3566],{"class":3114},[3092,8697,3118],{"class":3106},[3092,8699,3111],{"class":3110},[3092,8701,8702],{"class":3114},"\"4\"",[3092,8704,3126],{"class":3098},[3092,8706,8707,8710,8712,8714,8716,8719,8721,8723,8725,8727,8729,8731],{"class":3094,"line":3675},[3092,8708,8709],{"class":3098},"            \u003C",[3092,8711,3197],{"class":3102},[3092,8713,3504],{"class":3106},[3092,8715,3111],{"class":3110},[3092,8717,8718],{"class":3114},"\"Клавіша:\"",[3092,8720,6491],{"class":3106},[3092,8722,3111],{"class":3110},[3092,8724,3518],{"class":3114},[3092,8726,3837],{"class":3106},[3092,8728,3111],{"class":3110},[3092,8730,5403],{"class":3114},[3092,8732,3189],{"class":3098},[3092,8734,8735,8737,8739,8741,8743,8746,8749,8751,8754,8756,8758,8761],{"class":3094,"line":3687},[3092,8736,8709],{"class":3098},[3092,8738,5592],{"class":3102},[3092,8740,5608],{"class":3106},[3092,8742,3111],{"class":3110},[3092,8744,8745],{"class":3114},"\"#3C3C3C\"",[3092,8747,8748],{"class":3106}," CornerRadius",[3092,8750,3111],{"class":3110},[3092,8752,8753],{"class":3114},"\"3\"",[3092,8755,3545],{"class":3106},[3092,8757,3111],{"class":3110},[3092,8759,8760],{"class":3114},"\"4,1\"",[3092,8762,3126],{"class":3098},[3092,8764,8765,8768,8770,8772,8774,8777,8779,8781,8783,8785,8787,8790],{"class":3094,"line":3697},[3092,8766,8767],{"class":3098},"              \u003C",[3092,8769,3197],{"class":3102},[3092,8771,3504],{"class":3106},[3092,8773,3111],{"class":3110},[3092,8775,8776],{"class":3114},"\"Ctrl+,\"",[3092,8778,3837],{"class":3106},[3092,8780,3111],{"class":3110},[3092,8782,5403],{"class":3114},[3092,8784,6491],{"class":3106},[3092,8786,3111],{"class":3110},[3092,8788,8789],{"class":3114},"\"#E0E0E0\"",[3092,8791,3189],{"class":3098},[3092,8793,8794,8797,8799],{"class":3094,"line":4019},[3092,8795,8796],{"class":3098},"            \u003C/",[3092,8798,5592],{"class":3102},[3092,8800,3126],{"class":3098},[3092,8802,8803,8806,8808],{"class":3094,"line":4028},[3092,8804,8805],{"class":3098},"          \u003C/",[3092,8807,3103],{"class":3102},[3092,8809,3126],{"class":3098},[3092,8811,8812,8815,8817],{"class":3094,"line":4037},[3092,8813,8814],{"class":3098},"        \u003C/",[3092,8816,3103],{"class":3102},[3092,8818,3126],{"class":3098},[3092,8820,8821,8824,8826],{"class":3094,"line":4438},[3092,8822,8823],{"class":3098},"      \u003C/",[3092,8825,2984],{"class":3102},[3092,8827,3126],{"class":3098},[3092,8829,8830,8832,8834],{"class":3094,"line":4447},[3092,8831,3891],{"class":3098},[3092,8833,8569],{"class":3102},[3092,8835,3126],{"class":3098},[3092,8837,8838,8840,8842],{"class":3094,"line":4456},[3092,8839,3690],{"class":3098},[3092,8841,2965],{"class":3102},[3092,8843,3126],{"class":3098},[3092,8845,8846,8848,8850],{"class":3094,"line":4468},[3092,8847,3245],{"class":3098},[3092,8849,3103],{"class":3102},[3092,8851,3126],{"class":3098},[3041,8853,8854],{},"У реальних застосунках структуровані ToolTip-и часто містять іконку контролу, короткий заголовок і опис. Visual Studio, наприклад, показує ToolTip для кожного елемента IntelliSense із сигнатурою, коротким описом і посиланням на документацію. Це повністю реалізується засобами WPF з DataTemplate та прив'язкою даних.",[3049,8856],{},[3009,8858,8860],{"id":8859},"popup-програмно-керований-спливаючий-шар","Popup: програмно керований спливаючий шар",[3056,8862,8864],{"id":8863},"popup-проти-tooltip-у-чому-різниця","Popup проти ToolTip: у чому різниця",[3014,8866,8867,4050,8869,8871],{},[2963,8868,2984],{},[2963,8870,2987],{}," на перший погляд схожі — обидва показують щось \"поверх\" основного інтерфейсу. Але їхня природа і призначення кардинально різняться.",[3014,8873,8874,8876,8877,8879],{},[2963,8875,2984],{}," — суто реактивний: він з'являється автоматично при наведенні курсору і зникає без будь-якого втручання коду. Його поведінкою керує WPF та ",[2963,8878,8390],{},". Програмного контролю над ToolTip практично немає.",[3014,8881,8882,8884,8885,8888,8889,8892,8893,8895,8896,8898,8899,8902,8903,2966,8906,8909,8910,3007],{},[2963,8883,2987],{}," — це будівельний примітив для спливаючих шарів будь-якого типу: випадаючі меню, контекстні панелі, спливаючі форми, нотифікації. Його поява та зникнення ",[2958,8886,8887],{},"повністю підконтрольні коду",": властивість ",[2963,8890,8891],{},"IsOpen = true/false"," вмикає і вимикає ",[2963,8894,2987],{},". Саме з ",[2963,8897,2987],{}," внутрішньо побудовані ",[2963,8900,8901],{},"ComboBox","-список, ",[2963,8904,8905],{},"ContextMenu",[2963,8907,8908],{},"Menu","-підменю та сам ",[2963,8911,2984],{},[4139,8913,8914,8926,8953,8965],{},[4142,8915,8917,8918,8920,8921,8923,8924,3007],{"name":8916,"type":6397},"IsOpen","Ключова властивість. ",[2963,8919,3431],{}," — Popup відображається. ",[2963,8922,4594],{}," — прихований. Встановлюється програмно або через прив'язку даних. За замовчуванням — ",[2963,8925,4594],{},[4142,8927,8929,8930,8933,8934,8937,8938,8941,8942,8944,8945,8948,8949,8952],{"name":3006,"type":8928},"PlacementMode","Визначає, відносно чого і як розміщувати Popup. Найпоширеніші значення: ",[2963,8931,8932],{},"Bottom"," (під ",[2963,8935,8936],{},"PlacementTarget","), ",[2963,8939,8940],{},"Top"," (над), ",[2963,8943,8458],{}," (біля курсору), ",[2963,8946,8947],{},"Center"," (по центру target), ",[2963,8950,8951],{},"Absolute"," (у конкретних координатах екрана).",[4142,8954,8955,8956,8958,8959,8961,8962,8964],{"name":8936,"type":3741},"Елемент, відносно якого розраховується позиція Popup (якщо ",[2963,8957,3006],{}," не ",[2963,8960,8458],{}," і не ",[2963,8963,8951],{},"). За замовчуванням — батьківський елемент у дереві.",[4142,8966,6398,8968,8970,8971,8973,8974,8977],{"name":8967,"type":6397},"StaysOpen",[2963,8969,4594],{}," (за замовчуванням) — Popup автоматично закривається при кліку за його межами. Якщо ",[2963,8972,3431],{}," — закривається лише програмно. Використовуйте ",[2963,8975,8976],{},"StaysOpen=\"True\""," для Popup-форм, що потребують явного підтвердження.",[3079,8979,8981,9347],{"title":8980},"Popup: програмне відкриття при кліку на кнопку",[3083,8982,8984],{"className":3085,"code":8983,"language":3087,"meta":3088,"style":3088},"\u003CStackPanel Margin=\"20\" Spacing=\"12\">\n  \u003CTextBlock Text=\"Натисніть кнопку, щоб відкрити Popup:\"\n             Foreground=\"Gray\" FontSize=\"13\"/>\n\n  \u003CButton x:Name=\"popupToggleBtn\"\n          Content=\"📋 Показати деталі\"\n          Padding=\"12,6\"\n          HorizontalAlignment=\"Left\"\n          Command=\"{Binding ShowMessageCommand}\"\n          CommandParameter=\"Popup відкрито!\"/>\n\n  \u003CPopup x:Name=\"infoPopup\"\n         PlacementTarget=\"{Binding ElementName=popupToggleBtn}\"\n         Placement=\"Bottom\"\n         StaysOpen=\"False\"\n         IsOpen=\"False\">\n    \u003CBorder Background=\"#1E1E2E\"\n            BorderBrush=\"#6366F1\"\n            BorderThickness=\"1\"\n            CornerRadius=\"8\"\n            Padding=\"16\">\n      \u003CStackPanel Spacing=\"8\" Width=\"220\">\n        \u003CTextBlock Text=\"Детальна інформація\"\n                   FontWeight=\"Bold\" FontSize=\"13\"\n                   Foreground=\"White\"/>\n        \u003CTextBlock Text=\"Цей Popup з'являється безпосередньо під кнопкою. Клікніть будь-де поза ним — він закриється автоматично (StaysOpen=False).\"\n                   TextWrapping=\"Wrap\"\n                   FontSize=\"11\"\n                   Foreground=\"#A0A0C0\"/>\n      \u003C/StackPanel>\n    \u003C/Border>\n  \u003C/Popup>\n\u003C/StackPanel>\n",[2963,8985,8986,9006,9019,9035,9039,9052,9061,9069,9077,9086,9098,9102,9115,9125,9135,9145,9157,9170,9180,9189,9198,9208,9229,9242,9258,9270,9283,9292,9302,9313,9321,9329,9338],{"__ignoreMap":3088},[3092,8987,8988,8990,8992,8994,8996,8998,9000,9002,9004],{"class":3094,"line":3095},[3092,8989,3099],{"class":3098},[3092,8991,3103],{"class":3102},[3092,8993,3107],{"class":3106},[3092,8995,3111],{"class":3110},[3092,8997,3115],{"class":3114},[3092,8999,3118],{"class":3106},[3092,9001,3111],{"class":3110},[3092,9003,3123],{"class":3114},[3092,9005,3126],{"class":3098},[3092,9007,9008,9010,9012,9014,9016],{"class":3094,"line":3129},[3092,9009,3132],{"class":3098},[3092,9011,3197],{"class":3102},[3092,9013,3504],{"class":3106},[3092,9015,3111],{"class":3110},[3092,9017,9018],{"class":3114},"\"Натисніть кнопку, щоб відкрити Popup:\"\n",[3092,9020,9021,9023,9025,9027,9029,9031,9033],{"class":3094,"line":3145},[3092,9022,3221],{"class":3106},[3092,9024,3111],{"class":3110},[3092,9026,3518],{"class":3114},[3092,9028,3837],{"class":3106},[3092,9030,3111],{"class":3110},[3092,9032,4694],{"class":3114},[3092,9034,3189],{"class":3098},[3092,9036,9037],{"class":3094,"line":3156},[3092,9038,3318],{"emptyLinePlaceholder":3317},[3092,9040,9041,9043,9045,9047,9049],{"class":3094,"line":3167},[3092,9042,3132],{"class":3098},[3092,9044,2965],{"class":3102},[3092,9046,3137],{"class":3106},[3092,9048,3111],{"class":3110},[3092,9050,9051],{"class":3114},"\"popupToggleBtn\"\n",[3092,9053,9054,9056,9058],{"class":3094,"line":3178},[3092,9055,3148],{"class":3106},[3092,9057,3111],{"class":3110},[3092,9059,9060],{"class":3114},"\"📋 Показати деталі\"\n",[3092,9062,9063,9065,9067],{"class":3094,"line":3192},[3092,9064,3181],{"class":3106},[3092,9066,3111],{"class":3110},[3092,9068,3610],{"class":3114},[3092,9070,9071,9073,9075],{"class":3094,"line":3207},[3092,9072,3170],{"class":3106},[3092,9074,3111],{"class":3110},[3092,9076,3175],{"class":3114},[3092,9078,9079,9082,9084],{"class":3094,"line":3218},[3092,9080,9081],{"class":3106},"          Command",[3092,9083,3111],{"class":3110},[3092,9085,3620],{"class":3114},[3092,9087,9088,9091,9093,9096],{"class":3094,"line":3229},[3092,9089,9090],{"class":3106},"          CommandParameter",[3092,9092,3111],{"class":3110},[3092,9094,9095],{"class":3114},"\"Popup відкрито!\"",[3092,9097,3189],{"class":3098},[3092,9099,9100],{"class":3094,"line":3242},[3092,9101,3318],{"emptyLinePlaceholder":3317},[3092,9103,9104,9106,9108,9110,9112],{"class":3094,"line":3381},[3092,9105,3132],{"class":3098},[3092,9107,2987],{"class":3102},[3092,9109,3137],{"class":3106},[3092,9111,3111],{"class":3110},[3092,9113,9114],{"class":3114},"\"infoPopup\"\n",[3092,9116,9117,9120,9122],{"class":3094,"line":3657},[3092,9118,9119],{"class":3106},"         PlacementTarget",[3092,9121,3111],{"class":3110},[3092,9123,9124],{"class":3114},"\"{Binding ElementName=popupToggleBtn}\"\n",[3092,9126,9127,9130,9132],{"class":3094,"line":3666},[3092,9128,9129],{"class":3106},"         Placement",[3092,9131,3111],{"class":3110},[3092,9133,9134],{"class":3114},"\"Bottom\"\n",[3092,9136,9137,9140,9142],{"class":3094,"line":3675},[3092,9138,9139],{"class":3106},"         StaysOpen",[3092,9141,3111],{"class":3110},[3092,9143,9144],{"class":3114},"\"False\"\n",[3092,9146,9147,9150,9152,9155],{"class":3094,"line":3687},[3092,9148,9149],{"class":3106},"         IsOpen",[3092,9151,3111],{"class":3110},[3092,9153,9154],{"class":3114},"\"False\"",[3092,9156,3126],{"class":3098},[3092,9158,9159,9161,9163,9165,9167],{"class":3094,"line":3697},[3092,9160,3580],{"class":3098},[3092,9162,5592],{"class":3102},[3092,9164,5608],{"class":3106},[3092,9166,3111],{"class":3110},[3092,9168,9169],{"class":3114},"\"#1E1E2E\"\n",[3092,9171,9172,9175,9177],{"class":3094,"line":4019},[3092,9173,9174],{"class":3106},"            BorderBrush",[3092,9176,3111],{"class":3110},[3092,9178,9179],{"class":3114},"\"#6366F1\"\n",[3092,9181,9182,9185,9187],{"class":3094,"line":4028},[3092,9183,9184],{"class":3106},"            BorderThickness",[3092,9186,3111],{"class":3110},[3092,9188,7442],{"class":3114},[3092,9190,9191,9194,9196],{"class":3094,"line":4037},[3092,9192,9193],{"class":3106},"            CornerRadius",[3092,9195,3111],{"class":3110},[3092,9197,7877],{"class":3114},[3092,9199,9200,9202,9204,9206],{"class":3094,"line":4438},[3092,9201,3605],{"class":3106},[3092,9203,3111],{"class":3110},[3092,9205,4187],{"class":3114},[3092,9207,3126],{"class":3098},[3092,9209,9210,9212,9214,9216,9218,9220,9222,9224,9227],{"class":3094,"line":4447},[3092,9211,3825],{"class":3098},[3092,9213,3103],{"class":3102},[3092,9215,3118],{"class":3106},[3092,9217,3111],{"class":3110},[3092,9219,3573],{"class":3114},[3092,9221,3529],{"class":3106},[3092,9223,3111],{"class":3110},[3092,9225,9226],{"class":3114},"\"220\"",[3092,9228,3126],{"class":3098},[3092,9230,9231,9233,9235,9237,9239],{"class":3094,"line":4456},[3092,9232,8592],{"class":3098},[3092,9234,3197],{"class":3102},[3092,9236,3504],{"class":3106},[3092,9238,3111],{"class":3110},[3092,9240,9241],{"class":3114},"\"Детальна інформація\"\n",[3092,9243,9244,9247,9249,9251,9253,9255],{"class":3094,"line":4468},[3092,9245,9246],{"class":3106},"                   FontWeight",[3092,9248,3111],{"class":3110},[3092,9250,5546],{"class":3114},[3092,9252,3837],{"class":3106},[3092,9254,3111],{"class":3110},[3092,9256,9257],{"class":3114},"\"13\"\n",[3092,9259,9260,9263,9265,9268],{"class":3094,"line":4477},[3092,9261,9262],{"class":3106},"                   Foreground",[3092,9264,3111],{"class":3110},[3092,9266,9267],{"class":3114},"\"White\"",[3092,9269,3189],{"class":3098},[3092,9271,9272,9274,9276,9278,9280],{"class":3094,"line":7650},[3092,9273,8592],{"class":3098},[3092,9275,3197],{"class":3102},[3092,9277,3504],{"class":3106},[3092,9279,3111],{"class":3110},[3092,9281,9282],{"class":3114},"\"Цей Popup з'являється безпосередньо під кнопкою. Клікніть будь-де поза ним — він закриється автоматично (StaysOpen=False).\"\n",[3092,9284,9285,9288,9290],{"class":3094,"line":7660},[3092,9286,9287],{"class":3106},"                   TextWrapping",[3092,9289,3111],{"class":3110},[3092,9291,8666],{"class":3114},[3092,9293,9294,9297,9299],{"class":3094,"line":7670},[3092,9295,9296],{"class":3106},"                   FontSize",[3092,9298,3111],{"class":3110},[3092,9300,9301],{"class":3114},"\"11\"\n",[3092,9303,9304,9306,9308,9311],{"class":3094,"line":7679},[3092,9305,9262],{"class":3106},[3092,9307,3111],{"class":3110},[3092,9309,9310],{"class":3114},"\"#A0A0C0\"",[3092,9312,3189],{"class":3098},[3092,9314,9315,9317,9319],{"class":3094,"line":7690},[3092,9316,8823],{"class":3098},[3092,9318,3103],{"class":3102},[3092,9320,3126],{"class":3098},[3092,9322,9323,9325,9327],{"class":3094,"line":7701},[3092,9324,3891],{"class":3098},[3092,9326,5592],{"class":3102},[3092,9328,3126],{"class":3098},[3092,9330,9332,9334,9336],{"class":3094,"line":9331},32,[3092,9333,3690],{"class":3098},[3092,9335,2987],{"class":3102},[3092,9337,3126],{"class":3098},[3092,9339,9341,9343,9345],{"class":3094,"line":9340},33,[3092,9342,3245],{"class":3098},[3092,9344,3103],{"class":3102},[3092,9346,3126],{"class":3098},[3083,9348,9350],{"className":3252,"code":9349,"language":3254,"meta":3088,"style":3088},"// У реальному WPF: відкриваємо Popup у обробнику Click кнопки\nprivate void PopupToggleBtn_Click(object sender, RoutedEventArgs e)\n{\n    infoPopup.IsOpen = !infoPopup.IsOpen; // Перемикаємо стан\n}\n",[2963,9351,9352,9357,9381,9385,9410],{"__ignoreMap":3088},[3092,9353,9354],{"class":3094,"line":3095},[3092,9355,9356],{"class":5211},"// У реальному WPF: відкриваємо Popup у обробнику Click кнопки\n",[3092,9358,9359,9362,9364,9367,9369,9371,9373,9375,9377,9379],{"class":3094,"line":3129},[3092,9360,9361],{"class":3261},"private",[3092,9363,3326],{"class":3261},[3092,9365,9366],{"class":3291}," PopupToggleBtn_Click",[3092,9368,3332],{"class":3110},[3092,9370,3335],{"class":3261},[3092,9372,3339],{"class":3338},[3092,9374,2966],{"class":3110},[3092,9376,3344],{"class":3271},[3092,9378,3347],{"class":3338},[3092,9380,3350],{"class":3110},[3092,9382,9383],{"class":3094,"line":3145},[3092,9384,3283],{"class":3110},[3092,9386,9387,9390,9392,9394,9397,9400,9402,9404,9407],{"class":3094,"line":3156},[3092,9388,9389],{"class":3338},"    infoPopup",[3092,9391,3007],{"class":3110},[3092,9393,8916],{"class":3338},[3092,9395,9396],{"class":3110}," = !",[3092,9398,9399],{"class":3338},"infoPopup",[3092,9401,3007],{"class":3110},[3092,9403,8916],{"class":3338},[3092,9405,9406],{"class":3110},"; ",[3092,9408,9409],{"class":5211},"// Перемикаємо стан\n",[3092,9411,9412],{"class":3094,"line":3167},[3092,9413,3384],{"class":3110},[2955,9415,9416,9417,9419,9420,9423,9424,9426,9427,9430,9431,9433,9434,9436],{},"У превью ",[2963,9418,2987],{}," не відображається автоматично, оскільки ",[2963,9421,9422],{},"Click=\"...\""," не виконується у WASM-середовищі (лише ",[2963,9425,4092],{},"). У реальному WPF встановлення ",[2963,9428,9429],{},"IsOpen=\"True\""," безпосередньо у XAML одразу відображає ",[2963,9432,2987],{}," — спробуйте змінити значення атрибуту, щоб переконатися. Керування через код — єдиний повноцінний спосіб взаємодії з ",[2963,9435,2987],{}," у реальних застосунках.",[9438,9439,9440,9445,9446,9448,9449,9452,9453,9456,9457,9459],"warning",{},[2958,9441,9442,9444],{},[2963,9443,2987],{}," живе поза межами логічного дерева вікна."," Він рендерується у окремому нативному вікні (HWND) поверх усього іншого. Це означає: ",[2963,9447,2987],{}," не успадковує ",[2963,9450,9451],{},"DataContext"," від батьківського вікна автоматично — потрібно явно передати його через ",[2963,9454,9455],{},"DataContext=\"{Binding ElementName=mainWindow, Path=DataContext}\"",". Також ",[2963,9458,2987],{}," не обрізається межами вікна і може виходити за його краї на відміну від звичайних панелей.",[3049,9461],{},[3009,9463,9465],{"id":9464},"практичні-завдання","Практичні завдання",[3014,9467,9468],{},"Нижче — три завдання різного рівня складності, що охоплюють матеріал цієї статті. Рекомендується виконувати їх послідовно: кожне наступне спирається на навички, відпрацьовані у попередньому.",[9470,9471,9472,9552,9619],"accordion",{},[9473,9474,9477,9486,9502,9507,9540],"accordion-item",{"icon":9475,"label":9476},"i-lucide-circle-help","Рівень 1: Кнопка з іконкою та текстом",[3014,9478,9479,9482,9483,9485],{},[2958,9480,9481],{},"Ціль",": Закріпити розуміння ",[2963,9484,3751],{}," як довільного XAML-вмісту.",[3014,9487,9488,9491,9492,9495,9496,9498,9499,9501],{},[2958,9489,9490],{},"Завдання",": Створіть панель інструментів зі щонайменше чотирма кнопками. Кожна кнопка повинна містити іконку (емодзі або ",[2963,9493,9494],{},"Path","-геометрію) та текстовий підпис, розташовані горизонтально через ",[2963,9497,3103],{},". Кожна кнопка має ",[2963,9500,2984],{}," із коротким описом дії та клавіатурним скороченням.",[3014,9503,9504,3077],{},[2958,9505,9506],{},"Вимоги до реалізації",[7174,9508,9509,9512,9519,9524,9531],{},[7177,9510,9511],{},"Кнопки: \"Новий файл\", \"Відкрити\", \"Зберегти\", \"Видалити\".",[7177,9513,9514,9515,9518],{},"Одна кнопка — ",[2963,9516,9517],{},"IsDefault=\"True\""," (Зберегти).",[7177,9520,9514,9521,9523],{},[2963,9522,3459],{}," (Скасувати/Закрити).",[7177,9525,9526,9527,9530],{},"Використовувати ",[2963,9528,9529],{},"StackPanel Orientation=\"Horizontal\""," для іконки та тексту всередині кнопки.",[7177,9532,9533,9534,9536,9537,9539],{},"Усі кнопки — у ",[2963,9535,8251],{}," або горизонтальному ",[2963,9538,3103],{}," з зовнішнього боку.",[3014,9541,9542,9545,9546,9548,9549,9551],{},[2958,9543,9544],{},"Що перевірити",": Натисніть ",[3434,9547],{"value":3436}," — спрацьовує \"Зберегти\". Натисніть ",[3434,9550],{"value":3455}," — спрацьовує \"Скасувати\".",[9473,9553,9555,9567,9572],{"icon":9475,"label":9554},"Рівень 2: Галерея зображень з ProgressBar",[3014,9556,9557,9559,9560,2966,9562,4630,9564,9566],{},[2958,9558,9481],{},": Поєднати ",[2963,9561,2975],{},[2963,9563,2978],{},[2963,9565,2981],{}," в єдиному інтерактивному рішенні.",[3014,9568,9569,9571],{},[2958,9570,9490],{},": Реалізуйте мінімалістичний переглядач зображень із симуляцією завантаження.",[9573,9574,9575,9589,9603,9616],"ol",{},[7177,9576,9577,9578,9581,9582,3441,9584,9586,9587,3007],{},"Підготуйте 3–5 зображень (можна використовувати URL з ",[2963,9579,9580],{},"picsum.photos","). Відображайте їх у ",[2963,9583,2975],{},[2963,9585,6188],{}," у квадратному ",[2963,9588,5592],{},[7177,9590,9591,9592,9594,9595,3441,9598,3734,9600,9602],{},"Додайте ",[2963,9593,2978],{}," під зображенням. Зв'яжіть ",[2963,9596,9597],{},"ProgressBar.Value",[2963,9599,8093],{},[2963,9601,7722],{}," — переміщення Slider вручну симулює прогрес завантаження.",[7177,9604,9605,9606,9608,9609,9611,9612,9615],{},"Поруч з ",[2963,9607,2978],{}," додайте ",[2963,9610,3197],{}," з відсотком (прив'язка через ",[2963,9613,9614],{},"StringFormat={}{0:F0}%",").",[7177,9617,9618],{},"Додайте кнопки \"Попереднє\" та \"Наступне\" для перемикання між зображеннями у code-behind.",[9473,9620,9622,9630,9638,9643,9683],{"icon":9475,"label":9621},"Рівень 3: Popup з детальною інформацією при наведенні",[3014,9623,9624,9626,9627,9629],{},[2958,9625,9481],{},": Застосувати ",[2963,9628,2987],{}," для реалізації нетривіальної UI-взаємодії.",[3014,9631,9632,9634,9635,9637],{},[2958,9633,9490],{},": Створіть список елементів, де при натисканні кнопки \"ℹ Деталі\" поруч з кожним рядком відкривається ",[2963,9636,2987],{}," із розгорнутою інформацією.",[3014,9639,9640,3077],{},[2958,9641,9642],{},"Технічні вимоги",[7174,9644,9645,9651,9662,9671,9677],{},[7177,9646,9647,9648,9650],{},"Список з щонайменше 4 елементами; кожен елемент — ",[2963,9649,5592],{}," з ім'ям і кнопкою \"ℹ Деталі\".",[7177,9652,9653,9654,3441,9656,9659,9660,3007],{},"При натисканні \"ℹ Деталі\" — відкривається ",[2963,9655,2987],{},[2963,9657,9658],{},"Placement=\"Right\"",", прив'язаний до кнопки через ",[2963,9661,8936],{},[7177,9663,9664,9665,9667,9668,9670],{},"Вміст ",[2963,9666,2987],{},": заголовок, опис, ",[2963,9669,2978],{}," (наприклад, \"Наявність: 75%\").",[7177,9672,9673,9676],{},[2963,9674,9675],{},"StaysOpen=\"False\""," — Popup закривається при кліку поза ним.",[7177,9678,9679,9680,9682],{},"При відкритті другого Popup перший автоматично закривається (відстежуйте ",[2963,9681,8916],{}," поточного у code-behind).",[3014,9684,9685,9688,9689,9692,9693,3007],{},[2958,9686,9687],{},"Ускладнення (необов'язково)",": замість кнопки \"Деталі\" — реагувати на ",[2963,9690,9691],{},"MouseEnter"," елемента, відкриваючи Popup з невеликою затримкою через ",[2963,9694,9695],{},"DispatcherTimer",[3049,9697],{},[3009,9699,9701],{"id":9700},"підсумок","Підсумок",[3056,9703,9705],{"id":9704},"що-ми-вивчили-у-цій-статті","Що ми вивчили у цій статті",[3014,9707,9708],{},"У цій статті ми пройшли шлях від найпростіших кнопок до програмно керованих спливаючих шарів. Узагальнимо ключові висновки.",[3014,9710,9711,9714,9715,9717,9718,9720,9721,9723,9724,9726,9727,9729],{},[2958,9712,9713],{},"Button, RepeatButton, ToggleButton"," формують сімейство кнопок у WPF. Усі успадковують від ",[2963,9716,4124],{},", але відрізняються семантикою: ",[2963,9719,2965],{}," — миттєвий імпульс; ",[2963,9722,2969],{}," — безперервний потік подій; ",[2963,9725,2972],{}," — бінарний (або тристановий) перемикач зі збереженням стану. Властивість ",[2963,9728,3716],{}," може містити довільний XAML — це принципово відрізняє WPF від WinForms.",[3014,9731,9732,9734,9735,9738,9739,9742,9743,8068,9746,2966,9748,2966,9750,2966,9752,9754,9755,9757,9758,3007],{},[2958,9733,2975],{}," потребує розуміння двох речей: ",[2958,9736,9737],{},"Pack URI"," для адресації ресурсів (правило ",[2963,9740,9741],{},"Build Action = Resource",") та ",[2958,9744,9745],{},"режимів Stretch",[2963,9747,5461],{},[2963,9749,5469],{},[2963,9751,6273],{},[2963,9753,5488],{},"). Для аватарів і банерів — ",[2963,9756,5488],{},"; для загального перегляду — ",[2963,9759,6273],{},[3014,9761,9762,3724,9764,9766,9767,9770,9771,4630,9773,9775,9776,9778,9779,9781],{},[2958,9763,2978],{},[2963,9765,6340],{}," і ділить концепцію ",[2963,9768,9769],{},"Minimum/Maximum/Value"," із ",[2963,9772,2981],{},[2963,9774,4491],{},". Режим ",[2963,9777,2997],{}," перетворює його на аніматований індикатор зайнятості. Головна пастка — оновлення ",[2963,9780,6355],{}," безпосередньо у головному потоці блокує перерисовку.",[3014,9783,9784,9786,9787,9789,9790,2966,9792,4630,9794,9796,9797,9799],{},[2958,9785,2981],{}," — активний аналог ",[2963,9788,2978],{},". Властивості ",[2963,9791,7245],{},[2963,9793,3000],{},[2963,9795,3003],{}," обмежують вибір дискретними значеннями. Прив'язка через ",[2963,9798,7722],{}," — одна з найнаочніших демонстрацій потужності WPF Binding без жодного рядка C#.",[3014,9801,9802,9804,9805,3007],{},[2958,9803,2984],{}," — спливаюча підказка, що може бути як простим рядком, так і складним XAML-вмістом. Поведінку (затримки, розташування) регулює ",[2963,9806,8390],{},[3014,9808,9809,9811,9812,2966,9814,9816,9817,9819,9820,9822,9823,3007],{},[2958,9810,2987],{}," — примітив спливаючих шарів, поверх якого побудовано ",[2963,9813,8901],{},[2963,9815,8905],{}," та сам ",[2963,9818,2984],{},". Живе поза деревом вікна — ",[2963,9821,9451],{}," треба передавати явно. Керується через ",[2963,9824,8916],{},[3056,9826,9828],{"id":9827},"що-далі","Що далі",[3014,9830,9831,9832,9835,9836,2966,9838,4630,9841,9844,9845,9848,9849,4630,9852,9854],{},"У наступній статті ми розглянемо ",[2958,9833,9834],{},"текстові контроли"," — ",[2963,9837,3440],{},[2963,9839,9840],{},"PasswordBox",[2963,9842,9843],{},"RichTextBox",". Ці контроли мають значно глибшу модель введення, аніж здається на перший погляд: підтримка ",[2963,9846,9847],{},"undo/redo",", виділення тексту, форматування та події зміни. Окрема тема — ",[2963,9850,9851],{},"FlowDocument",[2963,9853,9843],{},", специфічні для WPF і не мають прямого аналога в Avalonia.",[9856,9857,9858],"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 .su1O8, html code.shiki .su1O8{--shiki-light:#0000FF;--shiki-default:#569CD6;--shiki-dark:#569CD6}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 .siwwj, html code.shiki .siwwj{--shiki-light:#001080;--shiki-default:#9CDCFE;--shiki-dark:#9CDCFE}html pre.shiki code .sbdoH, html code.shiki .sbdoH{--shiki-light:#A31515;--shiki-default:#CE9178;--shiki-dark:#CE9178}html pre.shiki code .spJ8K, html code.shiki .spJ8K{--shiki-light:#008000;--shiki-default:#6A9955;--shiki-dark:#6A9955}",{"title":3088,"searchDepth":3129,"depth":3129,"links":9860},[9861,9862,9867,9870,9873,9883,9890,9896,9901,9904,9905],{"id":3011,"depth":3129,"text":3012},{"id":3053,"depth":3129,"text":3054,"children":9863},[9864,9865,9866],{"id":3058,"depth":3145,"text":3059},{"id":3414,"depth":3145,"text":3415},{"id":3706,"depth":3145,"text":3707},{"id":4111,"depth":3129,"text":4112,"children":9868},[9869],{"id":4115,"depth":3145,"text":4116},{"id":4507,"depth":3129,"text":4508,"children":9871},[9872],{"id":4511,"depth":3145,"text":4512},{"id":4891,"depth":3129,"text":4892,"children":9874},[9875,9876,9877,9878,9879,9880,9881,9882],{"id":4895,"depth":3145,"text":4896},{"id":4920,"depth":3145,"text":4921},{"id":4941,"depth":3145,"text":4942},{"id":4956,"depth":3145,"text":4957},{"id":4975,"depth":3145,"text":4976},{"id":5007,"depth":3145,"text":5008},{"id":5173,"depth":3145,"text":5174},{"id":5437,"depth":3145,"text":5438},{"id":6316,"depth":3129,"text":6317,"children":9884},[9885,9886,9887,9888,9889],{"id":6320,"depth":3145,"text":6321},{"id":6349,"depth":3145,"text":6350},{"id":6428,"depth":3145,"text":6429},{"id":6772,"depth":3145,"text":6773},{"id":7039,"depth":3145,"text":7040},{"id":7131,"depth":3129,"text":7132,"children":9891},[9892,9893,9894,9895],{"id":7135,"depth":3145,"text":7136},{"id":7239,"depth":3145,"text":7240},{"id":7325,"depth":3145,"text":7326},{"id":7710,"depth":3145,"text":7711},{"id":8154,"depth":3129,"text":8155,"children":9897},[9898,9899,9900],{"id":8158,"depth":3145,"text":8159},{"id":8180,"depth":3145,"text":8181},{"id":8467,"depth":3145,"text":8468},{"id":8859,"depth":3129,"text":8860,"children":9902},[9903],{"id":8863,"depth":3145,"text":8864},{"id":9464,"depth":3129,"text":9465},{"id":9700,"depth":3129,"text":9701,"children":9906},[9907,9908],{"id":9704,"depth":3145,"text":9705},{"id":9827,"depth":3145,"text":9828},"Вивчаємо найбільш вживані контроли WPF — кнопки, зображення, індикатори прогресу, слайдери та спливаючі підказки. Кожен контрол розбирається від базових властивостей до нетривіальних деталей.","md",null,{},{"title":1417,"description":9909},"pCZ0tbvDeQVn--tNnR8nrxQ5DU8xeM2N1UFgf0uMAF4",[9916,9918],{"title":1413,"path":1414,"stem":1415,"description":9917,"children":-1},"Чим Avalonia відрізняється від WPF у layout: Spacing, RelativePanel, SplitView, Expander, ItemsRepeater, Transitions та інші можливості що роблять Avalonia потужнішим у сучасних сценаріях.",{"title":1421,"path":1422,"stem":1423,"description":9919,"children":-1},"Детальний порівняльний огляд стандартних контролів Avalonia та WPF: що повністю збігається, що відрізняється синтаксисом, що є в Avalonia але відсутнє у WPF — і навпаки. Практичний гід для тих, хто знає WPF і переходить на Avalonia.",1777911648467]