WPF에서 GridViewColumn 데이터를 자동 크기 조정하고 오른쪽 정렬하는 방법은 무엇입니까?

developer tip

WPF에서 GridViewColumn 데이터를 자동 크기 조정하고 오른쪽 정렬하는 방법은 무엇입니까?

optionbox 2020. 9. 24. 07:46

WPF에서 GridViewColumn 데이터를 자동 크기 조정하고 오른쪽 정렬하는 방법은 무엇입니까?

내가 어떻게 할 수있는:

ID 열의 텍스트를 오른쪽 맞춤
보이는 데이터가 가장 긴 셀의 텍스트 길이에 따라 각 열의 크기를 자동으로 조정 하시겠습니까?

다음은 코드입니다.

<ListView Name="lstCustomers" ItemsSource="{Binding Path=Collection}">
    <ListView.View>
        <GridView>
            <GridViewColumn Header="ID" DisplayMemberBinding="{Binding Id}" Width="40"/>
            <GridViewColumn Header="First Name" DisplayMemberBinding="{Binding FirstName}" Width="100" />
            <GridViewColumn Header="Last Name" DisplayMemberBinding="{Binding LastName}"/>
        </GridView>
    </ListView.View>
</ListView>

부분 답변 :

Kjetil에게 감사합니다. GridViewColumn.CellTemplate은 잘 작동하고 자동 너비는 물론 작동하지만 ObservativeCollection "컬렉션"이 열 너비보다 긴 데이터로 업데이트되면 열 크기가 자동으로 업데이트되지 않으므로 데이터의 초기 표시 :

<ListView Name="lstCustomers" ItemsSource="{Binding Path=Collection}">
    <ListView.View>
        <GridView>
            <GridViewColumn Header="ID" Width="Auto">
                <GridViewColumn.CellTemplate>
                    <DataTemplate>
                        <TextBlock Text="{Binding Id}" TextAlignment="Right" Width="40"/>
                    </DataTemplate>
                </GridViewColumn.CellTemplate>
            </GridViewColumn>
            <GridViewColumn Header="First Name" DisplayMemberBinding="{Binding FirstName}" Width="Auto" />
            <GridViewColumn Header="Last Name" DisplayMemberBinding="{Binding LastName}" Width="Auto"/>
        </GridView>
    </ListView.View>
</ListView>

각 열의 크기를 자동으로 조정하려면 GridViewColumn에서 Width = "Auto"를 설정할 수 있습니다.

ID 열의 텍스트를 오른쪽 정렬하려면 TextBlock을 사용하여 셀 템플릿을 만들고 TextAlignment를 설정할 수 있습니다. 그런 다음 ListViewItem.HorizontalContentAlignment (ListViewItem에 setter가있는 스타일 사용)를 설정하여 셀 템플릿이 전체 GridViewCell을 채우도록합니다.

더 간단한 해결책이있을 수 있지만 이것은 작동합니다.

참고 : 솔루션에는 Window.Resources의 HorizontalContentAlignment = Stretch 및 CellTemplate의 TextAlignment = Right 가 모두 필요합니다 .

<Window x:Class="WpfApplication6.Window1"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="Window1" Height="300" Width="300">
<Window.Resources>
    <Style TargetType="ListViewItem">
        <Setter Property="HorizontalContentAlignment" Value="Stretch" />
    </Style>
</Window.Resources>
<Grid>
    <ListView Name="lstCustomers" ItemsSource="{Binding Path=Collection}">
        <ListView.View>
            <GridView>
                <GridViewColumn Header="ID" Width="40">
                    <GridViewColumn.CellTemplate>
                        <DataTemplate>
                            <TextBlock Text="{Binding Id}" TextAlignment="Right" />
                        </DataTemplate>
                    </GridViewColumn.CellTemplate>
                </GridViewColumn>
                <GridViewColumn Header="First Name" DisplayMemberBinding="{Binding FirstName}" Width="Auto" />
                <GridViewColumn Header="Last Name" DisplayMemberBinding="{Binding LastName}" Width="Auto"/>
            </GridView>
        </ListView.View>
    </ListView>
</Grid>
</Window>

내용의 너비가 변경되면 다음 코드를 사용하여 각 열을 업데이트해야합니다.

private void ResizeGridViewColumn(GridViewColumn column)
{
    if (double.IsNaN(column.Width))
    {
        column.Width = column.ActualWidth;
    }

    column.Width = double.NaN;
}

해당 열에 대한 데이터가 업데이트 될 때마다 실행해야합니다.

목록보기도 크기가 조정되는 경우 동작 패턴을 사용하여 전체 ListView 너비에 맞게 열 크기를 조정할 수 있습니다. grid.column 정의를 사용하는 것과 거의 동일합니다.

<ListView HorizontalAlignment="Stretch"
          Behaviours:GridViewColumnResize.Enabled="True">
        <ListViewItem></ListViewItem>
        <ListView.View>
            <GridView>
                <GridViewColumn  Header="Column *"
                                   Behaviours:GridViewColumnResize.Width="*" >
                    <GridViewColumn.CellTemplate>
                        <DataTemplate>
                            <TextBox HorizontalAlignment="Stretch" Text="Example1" />
                        </DataTemplate>
                    </GridViewColumn.CellTemplate>

몇 가지 예와 소스 코드에 대한 링크는 다음 링크를 참조하십시오. http://lazycowprojects.tumblr.com/post/7063214400/wpf-c-listview-column-width-auto

나는 다음 클래스를 만들고 필요한 곳에서 응용 프로그램 전체에서 사용했습니다 GridView.

/// <summary>
/// Represents a view mode that displays data items in columns for a System.Windows.Controls.ListView control with auto sized columns based on the column content     
/// </summary>
public class AutoSizedGridView : GridView
{        
    protected override void PrepareItem(ListViewItem item)
    {
        foreach (GridViewColumn column in Columns)
        {
            // Setting NaN for the column width automatically determines the required
            // width enough to hold the content completely.

            // If the width is NaN, first set it to ActualWidth temporarily.
            if (double.IsNaN(column.Width))
              column.Width = column.ActualWidth;

            // Finally, set the column with to NaN. This raises the property change
            // event and re computes the width.
            column.Width = double.NaN;              
        }            
        base.PrepareItem(item);
    }
}

ItemContainerStyle이 있으므로 ItemContainerStyle에 HorizontalContentAlignment를 넣어야했습니다.

    <ListView.ItemContainerStyle>
            <Style TargetType="ListViewItem">
                <Style.Triggers>
                    <DataTrigger Binding="{Binding Path=FieldDef.DispDetail, Mode=OneWay}" Value="False">
                         <Setter Property="Visibility" Value="Collapsed"/>
                    </DataTrigger>
                </Style.Triggers>
                <Setter Property="HorizontalContentAlignment" Value="Stretch" /> 
    ....

나는 항상 모든 열의 크기를 조정한다는 점을 제외하고는 user1333423의 솔루션을 좋아했습니다. 일부 열의 너비를 고정해야했습니다. 따라서이 버전에서는 너비가 "자동"으로 설정된 열의 크기가 자동으로 조정되고 고정 된 양으로 설정된 열의 크기는 자동으로 조정되지 않습니다.

public class AutoSizedGridView : GridView
{
    HashSet<int> _autoWidthColumns;

    protected override void PrepareItem(ListViewItem item)
    {
        if (_autoWidthColumns == null)
        {
            _autoWidthColumns = new HashSet<int>();

            foreach (var column in Columns)
            {
                if(double.IsNaN(column.Width))
                    _autoWidthColumns.Add(column.GetHashCode());
            }                
        }

        foreach (GridViewColumn column in Columns)
        {
            if (_autoWidthColumns.Contains(column.GetHashCode()))
            {
                if (double.IsNaN(column.Width))
                    column.Width = column.ActualWidth;

                column.Width = double.NaN;                    
            }          
        }

        base.PrepareItem(item);
    }        
}

I know that this is too late but here is my approach:

<GridViewColumn x:Name="GridHeaderLocalSize"  Width="100">      
<GridViewColumn.Header>
    <GridViewColumnHeader HorizontalContentAlignment="Right">
        <Grid Width="Auto" HorizontalAlignment="Right">
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="100"/>
            </Grid.ColumnDefinitions>
            <TextBlock Grid.Column="0" Text="Local size" TextAlignment="Right" Padding="0,0,5,0"/>
        </Grid>
    </GridViewColumnHeader>
</GridViewColumn.Header>
<GridViewColumn.CellTemplate>
    <DataTemplate>
        <TextBlock Width="{Binding ElementName=GridHeaderLocalSize, Path=Width, FallbackValue=100}"  HorizontalAlignment="Right" TextAlignment="Right" Padding="0,0,5,0" Text="Text" >
        </TextBlock>
    </DataTemplate>
</GridViewColumn.CellTemplate>

The main idea is to bind the width of the cellTemplete element to the width of the ViewGridColumn. Width=100 is default width used until first resize. There isn't any code behind. Everything is in xaml.

I had trouble with the accepted answer (because I missed the HorizontalAlignment=Stretch portion and have adjusted the original answer).

This is another technique. It uses a Grid with a SharedSizeGroup.

Note: the Grid.IsSharedScope=true on the ListView.

<Window x:Class="WpfApplication6.Window1"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="Window1" Height="300" Width="300">
<Grid>
    <ListView Name="lstCustomers" ItemsSource="{Binding Path=Collection}" Grid.IsSharedSizeScope="True">
        <ListView.View>
            <GridView>
                <GridViewColumn Header="ID" Width="40">
                    <GridViewColumn.CellTemplate>
                        <DataTemplate>
                             <Grid>
                                  <Grid.ColumnDefinitions>
                                       <ColumnDefinition Width="Auto" SharedSizeGroup="IdColumn"/>
                                  </Grid.ColumnDefinitions>
                                  <TextBlock HorizontalAlignment="Right" Text={Binding Path=Id}"/>
                             </Grid>
                        </DataTemplate>
                    </GridViewColumn.CellTemplate>
                </GridViewColumn>
                <GridViewColumn Header="First Name" DisplayMemberBinding="{Binding FirstName}" Width="Auto" />
                <GridViewColumn Header="Last Name" DisplayMemberBinding="{Binding LastName}" Width="Auto"/>
            </GridView>
        </ListView.View>
    </ListView>
</Grid>
</Window>

I created a function for updating GridView column headers for a list and call it whenever the window is re-sized or the listview updates it's layout.

public void correctColumnWidths()
{
    double remainingSpace = myList.ActualWidth;

    if (remainingSpace > 0)
    {
         for (int i = 0; i < (myList.View as GridView).Columns.Count; i++)
              if (i != 2)
                   remainingSpace -= (myList.View as GridView).Columns[i].ActualWidth;

          //Leave 15 px free for scrollbar
          remainingSpace -= 15;

          (myList.View as GridView).Columns[2].Width = remainingSpace;
    }
}

This is your code

<ListView Name="lstCustomers" ItemsSource="{Binding Path=Collection}">
    <ListView.View>
        <GridView>
            <GridViewColumn Header="ID" DisplayMemberBinding="{Binding Id}" Width="40"/>
            <GridViewColumn Header="First Name" DisplayMemberBinding="{Binding FirstName}" Width="100" />
            <GridViewColumn Header="Last Name" DisplayMemberBinding="{Binding LastName}"/>
        </GridView>
    </ListView.View>
</ListView>

Try this

<ListView Name="lstCustomers" ItemsSource="{Binding Path=Collection}">
    <ListView.View>
        <GridView>
            <GridViewColumn DisplayMemberBinding="{Binding Id}" Width="Auto">
               <GridViewColumnHeader Content="ID" Width="Auto" />
            </GridViewColumn>
            <GridViewColumn DisplayMemberBinding="{Binding FirstName}" Width="Auto">
              <GridViewColumnHeader Content="First Name" Width="Auto" />
            </GridViewColumn>
            <GridViewColumn DisplayMemberBinding="{Binding LastName}" Width="Auto">
              <GridViewColumnHeader Content="Last Name" Width="Auto" />
            </GridViewColumn
        </GridView>
    </ListView.View>
</ListView>

참고URL : https://stackoverflow.com/questions/560581/how-to-autosize-and-right-align-gridviewcolumn-data-in-wpf

'developer tip' 카테고리의 다른 글

여러 선물을 기다리는 방법 (0)	2020.09.25
이 Java 8 람다가 컴파일에 실패하는 이유는 무엇입니까? (0)	2020.09.24
Xcode-모든 파일에서 텍스트 검색 (0)	2020.09.24
jQuery의 extend 메소드에 해당하는 JavaScript (0)	2020.09.24
JavaScript \ HTML에서 소켓을 사용하는 방법? (0)	2020.09.24

현재글WPF에서 GridViewColumn 데이터를 자동 크기 조정하고 오른쪽 정렬하는 방법은 무엇입니까?

optionbox

WPF에서 GridViewColumn 데이터를 자동 크기 조정하고 오른쪽 정렬하는 방법은 무엇입니까?

WPF에서 GridViewColumn 데이터를 자동 크기 조정하고 오른쪽 정렬하는 방법은 무엇입니까?

부분 답변 :

'developer tip' 카테고리의 다른 글

'developer tip'의 다른글

티스토리툴바

WPF에서 GridViewColumn 데이터를 자동 크기 조정하고 오른쪽 정렬하는 방법은 무엇입니까?

WPF에서 GridViewColumn 데이터를 자동 크기 조정하고 오른쪽 정렬하는 방법은 무엇입니까?

부분 답변 :

'developer tip' 카테고리의 다른 글

'developer tip'의 다른글

관련글

티스토리툴바