2016-04-01 18 views
2
C# ile evrensel uygulamalar Dünyada yeni, ben duyarlı benim arayüz yapmak ve ekran az 600 den olduğunda bu mesajı almaya çalıştık am

: enter image description hereekranı uygulama boyutlandırılır bir mesaj

öyle bunu tetikleyicilerle yapmak mümkün mü?

public enum LayoutStateType 
{ 
    TooSmall, BigEnough 
} 

public class LayoutTrigger : StateTriggerBase 
{ 
    public static readonly DependencyProperty MinimalStateWidthProperty = DependencyProperty.Register("MinimalStateWidth", typeof(double), typeof(LayoutTrigger), new PropertyMetadata(600.0, OnTriggerPropertyChanged)); 

    public static readonly DependencyProperty LayoutStateProperty = DependencyProperty.Register("LayoutState", typeof(LayoutStateType), typeof(LayoutTrigger), new PropertyMetadata(LayoutStateType.Landscape, OnTriggerPropertyChanged)); 

    public LayoutTrigger() 
    { 
     Window.Current.SizeChanged += Window_SizeChanged; 
     UpdateTrigger(); 
    } 

    public double MinimalStateWidth 
    { 
     get 
     { 
      return (double)GetValue(MinimalStateWidthProperty); 
     } 

     set 
     { 
      SetValue(MinimalStateWidthProperty, value); 
     } 
    } 

    public LayoutStateType LayoutState 
    { 
     get 
     { 
      return (LayoutStateType)GetValue(LayoutStateProperty); 
     } 

     set 
     { 
      SetValue(LayoutStateProperty, value); 
     } 
    } 

    private static void OnTriggerPropertyChanged(DependencyObject d, DependencyPropertyChangedEventArgs e) 
    { 
     var trigger = d as LayoutTrigger; 
     trigger.UpdateTrigger(); 
    } 

    private void Window_SizeChanged(object sender, WindowSizeChangedEventArgs e) 
    { 
     UpdateTrigger(); 
    } 

    private void UpdateTrigger() 
    { 
     switch (LayoutState) 
     { 
      case LayoutStateType.TooSmall: 
       if (Window.Current.Bounds.Width <= MinimalStateWidth) 
       { 
        SetActive(true); 
       } 
       else 
       { 
        SetActive(false); 
       } 

       break; 
      case LayoutStateType.BigEnough: 
      default: 
       if (Window.Current.Bounds.Width > MinimalStateWidth) 
       { 
        SetActive(false); 
       } 
       else 
       { 
        SetActive(true); 
       } 

       break; 
     } 
    } 
} 

Sen görsel durumlarını ayarlamak için bu durum tetikleyici kullanabilirsiniz: Bunun için özel bir StateTrigger oluşturabilir yardımıyla

cevap

3

doğrudan Sadece bir gridInstruction belirtmek pencerelerde 10. XAML kullanabilir tasarımınız ile ve görünürlüğünü collapsed olarak ayarlayın. Şimdi görünürlüğünü görünür veya daraltmak için ekran genişliğine dayalı adaptif tetikleyiciler kullanın.

<VisualStateManager.VisualStateGroups> 
      <VisualStateGroup x:Name="WindowStates"> 
       <VisualState x:Name="WideState"> 
        <VisualState.StateTriggers> 
         <AdaptiveTrigger MinWindowWidth="600" /> 
        </VisualState.StateTriggers> 
        <VisualState.Setters> 
         <Setter Target="gridInstruction.Visibility" Value="Collapsed" />       
        </VisualState.Setters> 
       </VisualState> 
       <VisualState x:Name="NarrowState"> 
        <VisualState.StateTriggers> 
         <AdaptiveTrigger MinWindowWidth="0" /> 
        </VisualState.StateTriggers> 
        <VisualState.Setters> 
         <Setter Target="gridInstruction.Visibility" Value="Visible" />       
        </VisualState.Setters> 
       </VisualState> 
      </VisualStateGroup> 
     </VisualStateManager.VisualStateGroups> 
+0

Teşekkürler Jerin Cevabınız için: D – Jina

2

için teşekkürler.

XAML kullanımı: 'çok küçük' görsel durumda

<Grid> 
    <VisualStateManager.VisualStateGroups> 
     <!-- Visual states reflect the application's view state --> 
     <VisualStateGroup x:Name="ApplicationViewStates"> 
      <VisualState x:Name="DefaultLayout"> 
       <VisualState.StateTriggers> 
        <triggers:LayoutTrigger LayoutState="TooSmall" /> 
       </VisualState.StateTriggers> 
      </VisualState> 
      <VisualState x:Name="PortraitLayout"> 
       <VisualState.StateTriggers> 
        <triggers:LayoutTrigger LayoutState="BigEnough" /> 
       </VisualState.StateTriggers> 
      </VisualState> 
     </VisualStateGroup> 
    </VisualStateManager.VisualStateGroups> 
</Grid Style="{StaticResource LayoutRootStyle}"> 

, gizlemek ve mesaj göstermek istediğini gizlemek

+0

Teşekkürler Glen Thomas Cevabınız için teşekkür ederiz: D – Jina