programing

창이 최대화될 때 모든 컨트롤의 크기가 비례적으로 조정되도록 하는 방법은 무엇입니까?

testmans 2023. 5. 15. 21:21
반응형

창이 최대화될 때 모든 컨트롤의 크기가 비례적으로 조정되도록 하는 방법은 무엇입니까?

최대화 버튼을 클릭하면 창이 최대화되지만 컨트롤의 크기가 비례적으로 조정되지 않습니다.컨트롤의 크기를 조정하는 가장 좋은 방법은 무엇입니까?MVVM을 사용하고 있습니다.

여기 제 코드가 있습니다.

<Window x:Class="DataTransfer.View.Window1"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Icon="/DataTransfer;component/View/Images/ms_msnexplore.gif"

        ResizeMode="CanResizeWithGrip"
        Title="Window1" Height="500" Width="600">
    <!--Style="{DynamicResource OfficeStyle}"-->
    <Window.Resources>
        <ResourceDictionary>
            <ResourceDictionary.MergedDictionaries>
                <!--<ResourceDictionary Source="/DataTransfer;component/View/WindowBase.xaml" />-->
                <!--<ResourceDictionary Source="/DataTransfer;component/Themes/WPFThemes/CalendarResource.xaml" />-->
            </ResourceDictionary.MergedDictionaries>
        </ResourceDictionary>
    </Window.Resources>

    <Grid>
    <Grid.RowDefinitions>
        <RowDefinition Height="*" />
    </Grid.RowDefinitions>
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width ="*" />
    </Grid.ColumnDefinitions>
        <Button Content="Button" HorizontalAlignment="Left" Margin="52,28,0,0" VerticalAlignment="Top" Width="75" Height="22" />
        <DatePicker Name="dp" HorizontalAlignment="Left" Margin="175,25,0,0" VerticalAlignment="Top" Width="123" Text="aaa" GotFocus="DateGotFocused" LostFocus="OnLeaveArchiveDate"/>
        <Calendar HorizontalAlignment="Left" Margin="47,162,0,0" VerticalAlignment="Top"/>
        <TextBox Name="t1" HorizontalAlignment="Left" Height="23" Margin="337,23,0,0" TextWrapping="Wrap" Text="TextBox" VerticalAlignment="Top" Width="120" LostFocus="LeaveField" />
        <RadioButton Content="RadioButton" HorizontalAlignment="Left" Margin="88,92,0,0" VerticalAlignment="Top"/>
        <CheckBox Content="CheckBox" HorizontalAlignment="Left" Margin="252,96,0,0" VerticalAlignment="Top"/>
        <ComboBox Name="combo" IsEditable="False" Text="aaa" IsReadOnly="True"
                  HorizontalAlignment="Left" Margin="337,89,0,0" VerticalAlignment="Top" Width="120" 
                  Focusable="True" GotFocus="ComboBoxGotFocused" >
            <ComboBoxItem>January</ComboBoxItem>
            <ComboBoxItem>February</ComboBoxItem>
        </ComboBox>
        <TextBlock HorizontalAlignment="Left" Height="40" Margin="260,184,0,0" TextWrapping="Wrap" Text="Text_Block" VerticalAlignment="Top" Width="257"/>

    </Grid>
</Window>

WPF에는 콘텐츠 크기를 자동으로 조정하는 특정 '컨테이너' 컨트롤이 있고 그렇지 않은 컨트롤도 있습니다.

다음은 콘텐츠 크기를 조정하지 않는 항목입니다(하나 이상을 사용하는 것 같습니다).

StackPanel
WrapPanel
Canvas
TabControl

콘텐츠 크기를 조정하는 몇 가지 방법은 다음과 같습니다.

Grid
UniformGrid
DockPanel

따라서, 거의 항상 사용하는 것이 바람직합니다.Grid신에대 StackPanel자동 크기 조정을 수행하지 않을 경우.아직 가능하다는 점을 참고하시기 바랍니다.Grid내부 조정기의 크기를 조정하지 않는 은...모든 것은 당신의 것에 달려 있습니다.Grid.RowDefinition그리고.Grid.ColumnDefinition설정:

<Grid>
    <Grid.RowDefinitions>
        <RowDefinition Height="100" /> <!--<<< Exact Height... won't resize -->
        <RowDefinition Height="Auto" /> <!--<<< Will resize to the size of contents -->
        <RowDefinition Height="*" /> <!--<<< Will resize taking all remaining space -->
    </Grid.RowDefinitions>
</Grid>

은 자한내다참오시십조하음을에 대해 더 알 수 .GridMSDN의 클래스 페이지에서 제어할 수 있습니다. MSDN의 WPF 컨테이너 제어 개요 페이지에서도 이러한 컨테이너 제어에 대한 자세한 내용을 확인할 수 있습니다.

및 속성을 사용하여 추가 크기 조정을 수행할 수 있습니다.이러한 속성의 기본값은 다음과 같습니다.Stretch포함된 컨트롤의 크기에 맞게 요소를 확장할 수 있습니다.그러나 요소를 다른 값으로 설정하면 요소가 늘어나지 않습니다.

업데이트 >>>

귀하의 의견에 대한 질문에 대한 답변:

을 합니다.Grid.RowDefinition그리고.Grid.ColumnDefinition기본 구조를 먼저 구성하는 설정...를 추가하는 것이 일반적입니다.Grid 외세 Grid필요한 경우 제어합니다.은 또한 있다니습수도를 할 수 .Grid.ColumnSpan그리고.Grid.RowSpan이 한 열 및 행에 있을 수 하는 속성Grid.

은 행이 하나 이고 행/열이 "/"/"입니다.Height/Width"*"'Auto'는 '*'로 사용하기 '로 설정되지 행/열에 하기 좋은 이지만 레이아웃을 설정할지에 자동'은 '*'으로 설정되지 않은 행/열에 사용하기 좋은 설정이지만 레이아웃을 원하는 방식에 따라 달라집니다.

.Auto할 수 이는 의컨사수설있만지정이는다원니, 때마그을이입지찬가것문도하에기것우리셀는에트롤용할▁the를 원하기 때문입니다.Grid우리를 위해 조정기 크기를 조정하는 것은...따라서, 우리는 설정하고 싶지 않습니다.Height또는Width이 컨트롤들 중에서.

내가 말한 요점은FrameworkElement.HorizontalAlignment그리고.FrameworkElement.VerticalAlignment재산은 단지 그들의 존재를 알리기 위한 것이었습니다...기본값이 이미이므로Stretch일반적으로 명시적으로 설정할 필요가 없습니다.

Margin속성은 일반적으로 컨트롤의 공간을 균등하게 확보하는 데 사용됩니다.Visual Studio Toolbox에서 컨트롤을 드래그 앤 드롭하면 VS가Margin컨트롤을 떨어뜨린 위치에 정확히 배치하는 속성이지만 일반적으로 컨트롤의 자동 크기 조정이 방해되기 때문에 이는 우리가 원하는 것이 아닙니다.만약 당신이 이것을 한다면, 그냥 삭제하거나 편집하세요.Margin필요에 맞는 자산입니다.

myCanvasCanvas 컨트롤이며 다른 모든 컨트롤러의 상위 컨트롤입니다.이 코드는 1366 x 768 이상의 해상도로 깔끔하게 크기를 조정할 수 있습니다. 해상도 x 2160 4k 해 4096 x 2160 테스트 완료

모든 항목을 기록합니다.MainWindow 설정성속설정(설()WindowStartupLocation,SizeToContent그리고.WindowState - 는 중요합니다 - ) - 이작이올바작면중려요다니합동.WindowState 사례 사항은 나의사사요구사은항입니다.Maximized:

XAML:

<Window x:Name="mainWindow" 
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="clr-namespace:MyApp" 
    xmlns:ed="http://schemas.microsoft.com/expression/2010/drawing"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" mc:Ignorable="d"
    x:Class="MyApp.MainWindow" 
     Title="MainWindow"  SizeChanged="MainWindow_SizeChanged"
    Width="1366" Height="768" WindowState="Maximized" WindowStartupLocation="CenterOwner" SizeToContent="WidthAndHeight">
  
    <Canvas x:Name="myCanvas" HorizontalAlignment="Left" Height="768" VerticalAlignment="Top" Width="1356">
        <Image x:Name="maxresdefault_1_1__jpg" Source="maxresdefault-1[1].jpg" Stretch="Fill" Opacity="0.6" Height="767" Canvas.Left="-6" Width="1366"/>

        <Separator Margin="0" Background="#FF302D2D" Foreground="#FF111010" Height="0" Canvas.Left="-811" Canvas.Top="148" Width="766"/>
        <Separator Margin="0" Background="#FF302D2D" Foreground="#FF111010" HorizontalAlignment="Right" Width="210" Height="0" Canvas.Left="1653" Canvas.Top="102"/>
        <Image x:Name="imgscroll" Source="BcaKKb47i[1].png" Stretch="Fill" RenderTransformOrigin="0.5,0.5" Height="523" Canvas.Left="-3" Canvas.Top="122" Width="580">
            <Image.RenderTransform>
                <TransformGroup>
                    <ScaleTransform/>
                    <SkewTransform/>
                    <RotateTransform Angle="89.093"/>
                    <TranslateTransform/>
                </TransformGroup>
            </Image.RenderTransform>
        </Image>

.cs:

 private void MainWindow_SizeChanged(object sender, SizeChangedEventArgs e)
    {
        myCanvas.Width = e.NewSize.Width;
        myCanvas.Height = e.NewSize.Height;

        double xChange = 1, yChange = 1;

        if (e.PreviousSize.Width != 0)
            xChange = (e.NewSize.Width / e.PreviousSize.Width);

        if (e.PreviousSize.Height != 0)
            yChange = (e.NewSize.Height / e.PreviousSize.Height);

        ScaleTransform scale = new ScaleTransform(myCanvas.LayoutTransform.Value.M11 * xChange, myCanvas.LayoutTransform.Value.M22 * yChange);
        myCanvas.LayoutTransform = scale;
        myCanvas.UpdateLayout();
    }

글쎄요, 꽤 간단합니다.

창의 크기 조정 이벤트 핸들러에서 창의 크기를 계산하고 이 부분을 사용하여 1) 높이, 2) 너비, 3) 캔버스를 조정합니다.상단, 4) 캔버스.캔버스 내부의 모든 하위 컨트롤의 왼쪽 속성입니다.

코드는 다음과 같습니다.

private void window1_SizeChanged(object sender, SizeChangedEventArgs e)
        {
            myCanvas.Width = e.NewSize.Width;
            myCanvas.Height = e.NewSize.Height;

            double xChange = 1, yChange = 1;

            if (e.PreviousSize.Width != 0)
            xChange = (e.NewSize.Width/e.PreviousSize.Width);

            if (e.PreviousSize.Height != 0)
            yChange = (e.NewSize.Height / e.PreviousSize.Height);

            foreach (FrameworkElement fe in myCanvas.Children )
            {   
                /*because I didn't want to resize the grid I'm having inside the canvas in this particular instance. (doing that from xaml) */            
                if (fe is Grid == false)
                {
                    fe.Height = fe.ActualHeight * yChange;
                    fe.Width = fe.ActualWidth * xChange;

                    Canvas.SetTop(fe, Canvas.GetTop(fe) * yChange);
                    Canvas.SetLeft(fe, Canvas.GetLeft(fe) * xChange);

                }
            }
        }

언급URL : https://stackoverflow.com/questions/19393774/how-to-make-all-controls-resize-accordingly-proportionally-when-window-is-maximi

반응형