मैं WPF में अनुकूली लेआउट कैसे बना सकता हूं?

Question

एक वेबसाइट को मीडिया प्रश्नों का उपयोग करके छोटे स्क्रीन आकारों को अनुकूलित करने के लिए डिज़ाइन किया जा सकता है। उदाहरण के लिए, एक विस्तृत स्क्रीन पर तीन कॉलम, कम-रिज़ॉल्यूशन फोन पर एक कॉलम।

क्या उपलब्ध स्क्रीन स्पेस या अभिभावक नियंत्रण आकार के आधार पर लेआउट समायोजित करने के लिए WPF के लिए एक समान तकनीक है?

उदाहरण के लिए, मैं एक बड़ी स्क्रीन पर क्षैतिज रूप से प्रदर्शित 3 कॉलम रखना चाहता हूं, लेकिन छोटी स्क्रीन पर लंबवत प्रदर्शित होता हूं। आदर्श रूप से, मैं इस तरह के लेआउट तैयार करना चाहता हूं: "यदि इस नियंत्रण की चौड़ाई 400 अंकों से कम है, तो इस तरह से इन नियंत्रणों को पुनर्व्यवस्थित करें।"

मैं WPF में इस तरह एक अनुकूली डिज़ाइन कैसे बना सकता हूं? यही है, विशिष्ट अभिभावक नियंत्रण आकार के लिए नियंत्रण के लिए विभिन्न लेआउट परिभाषित करें?

बेहद धीमी होने से बचने के लिए आदर्श नियंत्रण को डुप्लीकेट या पुनर्निर्मित करने के बजाय पुन: व्यवस्थित किया जाना चाहिए।

Answer 1

यह करने के लिए सबसे आसान तरीका है, तो बाध्य मूल्य अधिक से अधिक या एक पैरामीटर से भी कम है परीक्षण करने के लिए DataTriggers और एक Converter के साथ है।

यह आपको बाध्य मूल्य के आधार पर शैली सेटर्स को आसानी से समायोजित करने की अनुमति देगा। उदाहरण के लिए, आप इस्तेमाल कर सकते हैं

<Style x:Key="MyControlStyle"> 
    <!-- Default Values --> 
    <Setter Property="Grid.Row" Value="0" /> 
    <Setter Property="Grid.Column" Value="0" /> 
    <Style.Triggers> 
     <DataTrigger Value="True" 
        Binding="{Binding ActualHeight, ElementName=MyWindow, 
         Converter={StaticResource IsValueLessThanParameter}, 
         ConverterParameter=400}"> 
      <!-- Values to use when Trigger condition is met --> 
      <Setter Property="Grid.Row" Value="1" /> 
      <Setter Property="Grid.Column" Value="1" /> 
     </DataTrigger> 
    </Style.Triggers> 
</Style> 

मामले में जहां आपको लगता है कि कुछ ट्रिगर मूल्य के आधार पर बदल कई टुकड़ों के साथ एक अधिक जटिल लेआउट में, आप के बजाय सिर्फ अलग-अलग प्रॉपर्टी आपके ट्रिगर के साथ पूरे टेम्पलेट्स की जगह ले सकता

<Style x:Key="MyContentControlStyle" TargetType="{x:Type ContentControl}"> 
    <Setter Property="ContentTemplate" Value="{StaticResource BigTemplate}" /> 
    <Style.Triggers> 
     <DataTrigger Value="True" 
        Binding="{Binding ActualHeight, ElementName=MyWindow, 
         Converter={StaticResource IsValueLessThanParameter}, 
         ConverterParameter=400}"> 
      <Setter Property="ContentTemplate" Value="{StaticResource LittleTemplate}" /> 
     </DataTrigger> 
    </Style.Triggers> 
</Style> 

मेरा मानना ​​है कि आप अपने बाइंडिंग में एप्लिकेशन के बारे में अतिरिक्त जानकारी का उपयोग करने के लिए SystemParameters ऑब्जेक्ट से भी जुड़ सकते हैं, हालांकि मुझे अभी इसके लिए सटीक वाक्यविन्यास याद नहीं है।

Answer 2

मुझे ऐसा कुछ करने का एकमात्र तरीका कोड में है, और आपको कस्टम लेआउट बनाना होगा। ऐसा करने का सबसे आसान तरीका पैनल से विरासत में प्राप्त एक नई कक्षा बनाना है, और MeasureOverride और ArrangeOverride को कार्यान्वित करना है। मैंने पहले कस्टम लेआउट किए हैं, और वे सभी मामलों के लिए काम करने के लिए एक बड़ा दर्द होने का अंत कर सकते हैं। यदि आप Google "wpf कस्टम लेआउट" के साथ शुरू करने के लिए कुछ अच्छे उदाहरण प्राप्त करेंगे। आप जो भी कार्यक्षमता चाहते हैं उसे देखते हुए, आप निश्चित रूप से अपने काम काट लेंगे। आप अपने कोड को विभिन्न आकारों में क्या शामिल किया जाना चाहिए इसका एक विचार देने के लिए xaml में एनोटेशन डालने के बारे में देखने के लिए संलग्न गुणों को देखना चाहेंगे।

Answer 3

आप WPF के UWP स्वाद का उपयोग कर रहे हैं, तो आप AdaptiveTrigger उपयोग कर सकते हैं:

<AdaptiveTrigger MinWindowWidth="720" MinWindowHeight="900" />