अन्य सभी नियंत्रणों के ऊपर ओवरले नियंत्रण कैसे करें?

Question

मुझे अन्य सभी नियंत्रणों के ऊपर एक नियंत्रण बनाने की आवश्यकता है, इसलिए यह आंशिक रूप से उन्हें ओवरले करेगा।

Answer 1

यदि आप अपने लेआउट में Canvasया का उपयोग कर रहे हैं Grid, तो नियंत्रण को एक उच्च पर रखें ZIndex।

से MSDN :

<Page xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" WindowTitle="ZIndex Sample">
  <Canvas>
    <Rectangle Canvas.ZIndex="3" Width="100" Height="100" Canvas.Top="100" Canvas.Left="100" Fill="blue"/>
    <Rectangle Canvas.ZIndex="1" Width="100" Height="100" Canvas.Top="150" Canvas.Left="150" Fill="yellow"/>
    <Rectangle Canvas.ZIndex="2" Width="100" Height="100" Canvas.Top="200" Canvas.Left="200" Fill="green"/>

    <!-- Reverse the order to illustrate z-index property -->

    <Rectangle Canvas.ZIndex="1" Width="100" Height="100" Canvas.Top="300" Canvas.Left="200" Fill="green"/>
    <Rectangle Canvas.ZIndex="3" Width="100" Height="100" Canvas.Top="350" Canvas.Left="150" Fill="yellow"/>
    <Rectangle Canvas.ZIndex="2" Width="100" Height="100" Canvas.Top="400" Canvas.Left="100" Fill="blue"/>
  </Canvas>
</Page>

यदि आप निर्दिष्ट नहीं करते हैं ZIndex, तो एक पैनल के बच्चों को उनके द्वारा निर्दिष्ट क्रम में प्रस्तुत किया जाता है (अर्थात शीर्ष पर अंतिम)।

यदि आप कुछ अधिक जटिल करना चाहते हैं, तो आप देख सकते हैं कि ChildWindowसिल्वरलाइट में कैसे लागू किया जाता है। यह एक संपूर्ण पृष्ठभूमि और आपके पूरे हिस्से को पॉपअप करता है RootVisual।

Comments

नोट: यह HTML कैनवस की तरह नहीं है जैसा मैंने उम्मीद की थी। यह प्रत्यक्ष ड्राइंग के लिए नहीं है, लेकिन एक पूर्ण स्थिति संदर्भ प्रदान करता है (जो आप आमतौर पर सीधे आकार में डालते हैं)।

— पॉल

Answer 2

रॉबर्ट रॉसनी के पास एक अच्छा समाधान है। यहां मैंने एक वैकल्पिक समाधान का उपयोग किया है जो अतीत में "ओवरले" को बाकी सामग्री से अलग करता है। यह समाधान Panel.ZIndexअन्य सभी के शीर्ष पर "ओवरले" लगाने के लिए संलग्न संपत्ति का लाभ उठाता है। आप या तो कोड में "ओवरले" की दृश्यता निर्धारित कर सकते हैं या उपयोग कर सकते हैं DataTrigger।

<Grid x:Name="LayoutRoot">

 <Grid x:Name="Overlay" Panel.ZIndex="1000" Visibility="Collapsed">
    <Grid.Background>
      <SolidColorBrush Color="Black" Opacity=".5"/>
    </Grid.Background>

    <!-- Add controls as needed -->
  </Grid>

  <!-- Use whatever layout you need -->
  <ContentControl x:Name="MainContent" />

</Grid>

Comments

यह ओवरले पूरी खिड़की को कवर करेगा, न कि केवल एक विशिष्ट क्षेत्र को।

— मेट्रो स्मर्फ

सबसे अच्छा समाधान कभी! धन्यवाद!

— डेवलपर

बहुत कम कोड के साथ, वास्तव में मुझे अपनी संपूर्ण ऐप विंडो पर "गोपनीयता स्क्रीन" बिछाने की आवश्यकता थी (जैसे संवेदनशील जानकारी छिपाने के लिए यदि उपयोगकर्ता अपने डेस्क से दूर जाता है)। बहुत बढ़िया!

— व्हिट्ज़

Answer 3

ग्रिड के एक ही सेल में नियंत्रण बैक-टू-फ्रंट प्रस्तुत किए जाते हैं। तो एक नियंत्रण को दूसरे के शीर्ष पर रखने का एक सरल तरीका है कि इसे एक ही सेल में रखा जाए।

यहां एक उपयोगी उदाहरण है, जो एक पैनल को पॉप अप करता है जो एक व्यस्त संदेश के साथ दृश्य (यानी उपयोगकर्ता नियंत्रण) में सब कुछ निष्क्रिय कर देता है जबकि एक लंबे समय से चल रहे कार्य को निष्पादित किया जाता है (यानी जबकि BusyMessageबाध्य संपत्ति शून्य नहीं है):

<Grid>

    <local:MyUserControl DataContext="{Binding}"/>

    <Grid>
        <Grid.Style>
            <Style TargetType="Grid">
                <Setter Property="Visibility"
                        Value="Visible" />
                <Style.Triggers>
                    <DataTrigger Binding="{Binding BusyMessage}"
                                 Value="{x:Null}">
                        <Setter Property="Visibility"
                                Value="Collapsed" />
                    </DataTrigger>

                </Style.Triggers>
            </Style>
        </Grid.Style>
        <Border HorizontalAlignment="Stretch"
                VerticalAlignment="Stretch"
                Background="DarkGray"
                Opacity=".7" />
        <Border HorizontalAlignment="Center"
                VerticalAlignment="Center"
                Background="White"
                Padding="20"
                BorderBrush="Orange"
                BorderThickness="4">
            <TextBlock Text="{Binding BusyMessage}" />
        </Border>
    </Grid>
</Grid>

Answer 4

अपने xaml कोड के अंत में जो नियंत्रण आप सामने लाना चाहते हैं, उसे रखें। अर्थात

<Grid>
  <TabControl ...>
  </TabControl>
  <Button Content="ALways on top of TabControl Button"/>
</Grid>

Answer 5

यह WPF में एडोर्नर्स का एक सामान्य कार्य है । एडोर्नर्स आमतौर पर अन्य सभी नियंत्रणों से ऊपर दिखाई देते हैं, लेकिन अन्य आदेश जो जेड-ऑर्डर का उल्लेख करते हैं, वे आपके मामले को बेहतर ढंग से फिट कर सकते हैं।

Answer 6

<Canvas Panel.ZIndex="1" HorizontalAlignment="Left" VerticalAlignment="Top" Width="570">
  <!-- YOUR XAML CODE -->
</Canvas>