Loading...
درخت عناصر در WPF
در بسیاری از تکنولوژی ها عنصار و کنترل ها را با استفاده از ساختار درختی سازماندهی می کنند و این کار باعث می شود تا برنامه نویسان کنترل بهتری بر روی عناصر و کنترل ها داشته باشند. در WPF نیز عناصر به صورت یک ساختار درختی جامع سازماندهی می شوند. در WPF از دو نوع ساختار درختی زیر استفاده می شود.
- ساختار درخت منطقی (Logical Tree Structure)
- ساختار درخت بصری (Visual Tree Structure)
با کمک این ساختارها شما می توانید ارتباط بین عناصر UI برنامه را ایجاد و کنترل کنید.
ساختار درخت منطقی
در برنامه های WPF، ساختار عناصر UI که با استفاده از XAML تعریف می شوند، نمایانگر ساختار درخت منطقی هستند. در WPF ساختار درخت منطقی موارد زیر را تعریف می کند.
- Dependency properties
- منابع پویا و استاتیک (Static and dynamic resources)
- بایند کردن عناصر با نام و غیره
به مثال زیر که در آن یک Button و یک ListBox در داخل یک StackPanel ایجاد شده است، توجه کنید.
1 2 3 4 5 6 7 8 9 10 11 12 13 | <Window x:Class = "WPFElementsTree.MainWindow" xmlns = "http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x = "http://schemas.microsoft.com/winfx/2006/xaml" Title = "MainWindow" Height = "350" Width = "604"> <StackPanel> <Button x:Name = "button" Height = "30" Width = "70" Content = "OK" Margin = "20" /> <ListBox x:Name = "listBox" Height = "100" Width = "100" Margin = "20"> <ListBoxItem Content = "Item 1" /> <ListBoxItem Content = "Item 2" /> <ListBoxItem Content = "Item 3" /> </ListBox> </StackPanel> </Window> |
اگر به کد فوق دقت کنید، متوجه می شود که یک ساختار درختی را تشکیل می دهد. در این ساختار عنصر Window به عنوان عنصر ریشه تعریف شده است. در داخل گره ریشه یک فرزند از نوع StackPanel تعریف شده است. خود این گره دو گره فرزند دارد که یکی Button و بدون گره فرزند و دیگری ListBox که شامل سه فرزند از نوع ListBoxItem است.
ساختار درخت بصری
در WPF، مفهوم درخت بصری به ساختار عناصری که رندر شده اند اطلاق می دشود. و شامل تمام عناصری است که در صفحه خروجی رندر شده اند. زمانی که یک برنامه نویس یک Template را برای یک عنصر تعریف می کند، در واقع در حال رندر کردن درخت بصری آن کنترل است. در WPF درخت بصری در موارد زیر استفاده می شود.
- رندر کردن اشیاء بصری
- رندر کردن طرح بندیها
- routed event هایی که بیشتر در طول درخت بصری جا به جا می شوند.
برای مشاهده ساختار درخت بصری مربوط به مثال ساده بالا، ابتدا آن را اجرا کنید.
و سپس در داخل ویژوال استودیو پنل Live Visual Tree را باز کنید تا ساختار درخت بصری مربوط به UI برنامه را مشاهده کنید.
ساختار درخت بصری در واقع بر روی ساختار درخت منطقی قرار دارد. همانطور که در تصویر فوق مشاهده می کنید، هر آنچه که در درخت منطقی وجود داشت، در درخت بصری نیز وجود دارد.
- درخت منطقی بسیاری از جزئیات مربوط به این که عنصر چگونه نمایش داده شود را حذف می کند تا شما بتوانید بر روی ساختار اصلی رابط کاربری تمرکز کنید.
- درخت منطقی همان چیزی است که شما برای ایجاد ساختار پایه ای رابط کاربری برنامه از آن استفاده می کنید.
- در مقابل برای طراحی جزئیات رابط کاربری باید از درخت بصری استفاده کنید.
هیچ نظری ثبت نشده است