너비/높이를 xaml에 비례하도록 설정 하시겠습니까?

Question

크기가 300x100 인 사용자 정의 컨트롤을 만들고 있는데 1024x768 화면에서 그 해상도를 사용하고 싶습니다. 그러나 2048x1536 화면에서는 일반적으로 600x200이되고 싶습니다. 높이 차이에 비례하여 크기를 설정하십시오 (따라서 화면이 두 배나 높으면 컨트롤이 두 배, 너비가 두 배가됩니다).

어떤 아이디어라도 코드를 사용하지 않고이 작업을 수행 할 수 있습니다 (다른 선택을하지 않으면 기꺼이 할 수 있습니다).

Answer 1

프록시 컨트롤을 만들면 코드없이이 문제를 해결할 수 있습니다. 사람들은 종종이 접근법을 사용하여 this question에 대한 응답에서와 같이 바인딩 할 수있는 ActualWidth 및 ActualHeight 속성을 올바르게 업데이트합니다.

경우에 따라 프록시 컨트롤의 요소를 전체 창 크기로 늘어나는 일부 요소에 바인딩 할 수 있습니다. 바운드 요소의 너비 또는 높이가 변경되면 프록시 컨트롤의 두 속성 값을 계산 된 비례 높이 및 너비로 설정할 수 있습니다. 그런 다음 사용자 정의 컨트롤의 너비와 높이에 대해 이러한 비례 크기에 바인딩 할 수 있습니다. 예를 들어

: UserControl을 변경하여 그 다음 XAML에서

public class ProportionalSizeHelper : FrameworkElement, INotifyPropertyChanged 
{ 
    private double _proportionalWidth = 0; 
    private double _proportionalHeight = 0; 

    public event PropertyChangedEventHandler PropertyChanged; 

    public FrameworkElement Element 
    { 
     get { return (FrameworkElement)GetValue(ElementProperty); } 
     set { SetValue(ElementProperty, value); } 
    } 

    public double ProportionalHeight 
    { 
     get{ return _proportionalHeight; } 
    } 

    public double ProportionalWidth 
    { 
     get { return _proportionalWidth; } 
    } 

    public static readonly DependencyProperty ElementProperty = 
     DependencyProperty.Register("Element", typeof(FrameworkElement), typeof(ProportionalSizeHelper), 
            new PropertyMetadata(null,OnElementPropertyChanged)); 

    private static void OnElementPropertyChanged(DependencyObject d, DependencyPropertyChangedEventArgs e) 
    { 
     ((ProportionalSizeHelper)d).OnElementChanged(e); 
    } 

    private void OnElementChanged(DependencyPropertyChangedEventArgs e) 
    { 
     FrameworkElement oldElement = (FrameworkElement)e.OldValue; 
     FrameworkElement newElement = (FrameworkElement)e.NewValue; 

     if (newElement != null) 
     { 
      newElement.SizeChanged += new SizeChangedEventHandler(Element_SizeChanged); 
     } 
     else 
     { 
      _proportionalHeight = 0; 
      _proportionalWidth = 0; 
     } 
     if (oldElement != null) 
     { 
      oldElement.SizeChanged -= new SizeChangedEventHandler(Element_SizeChanged); 
     } 
     NotifyPropChange(); 
    } 

    private void Element_SizeChanged(object sender, SizeChangedEventArgs e) 
    { 
     // This can be whatever calculation you need 
     double factor = Math.Min(Element.ActualWidth/1024, Element.ActualHeight/768); 
     _proportionalHeight = 100*factor; 
     _proportionalWidth = 300*factor; 
     NotifyPropChange(); 
    } 

    private void NotifyPropChange() 
    { 
     if (PropertyChanged != null) 
     { 
      PropertyChanged(this, new PropertyChangedEventArgs("ProportionalWidth".NonNls())); 
      PropertyChanged(this, new PropertyChangedEventArgs("ProportionalHeight".NonNls())); 
     } 
    } 
} 

은 무엇이든 당신이 필요합니다

<Grid x:Name="LayoutRoot"> 
    <Grid.Resources> 
     <c:ProportionalSizeHelper Element="{Binding ElementName=LayoutRoot}" x:Name="proxy" /> 
    </Grid.Resources> 
    <UserControl Width="{Binding ProportionalWidth, ElementName=proxy}" Height={Binding ProportionalHeight, ElementName=proxy} /> 
</Grid> 

Answer 2

이는 실버 코드입니다. 여기에 너비 화면 높이를 얻을하는 방법

public MainPage() 
    { 
     InitializeComponent(); 
     Loaded += new RoutedEventHandler(MainPage_Loaded); 
    } 
    void MainPage_Loaded(object sender, RoutedEventArgs e) 
    { 
     int Width = HtmlPage.Window.Eval("screen.width"); 
     int Height = HtmlPage.Window.Eval("screen.height"); 

//Now here increase the height and width of control 
double factor = Width/1024; // this is your default you asked for 
gdTestElement.Width = 300*factor; 
gdTestElement.Height = 100*factor; 

     } 

: 당신은 현재 resoulotion을 revils 어떤 API를 알고, 시도하고 나를