sourcecode

WPF 데이터 템플릿이 목록 상자의 전체 너비를 채우도록 하려면 어떻게 해야 합니까?

codebag 2023. 5. 3. 21:22
반응형

WPF 데이터 템플릿이 목록 상자의 전체 너비를 채우도록 하려면 어떻게 해야 합니까?

나는 있습니다ListBox DataTemplateWPF에서.저는 하나의 아이템이 왼쪽에 딱 붙어있기를 원합니다.ListBox오른쪽을 꽉 조여야 할 항목이 하나 더 있는데 어떻게 해야 할지 모르겠어요.

지금까지 나는Grid세 개의 열이 있는 왼쪽과 오른쪽 열에는 내용이 있고 가운데는 너비가 "*"로 설정된 자리 표시자입니다.제가 어디서 잘못되고 있나요?

코드는 다음과 같습니다.

<DataTemplate x:Key="SmallCustomerListItem">
    <Grid HorizontalAlignment="Stretch">
        <Grid.RowDefinitions>
            <RowDefinition/>
        </Grid.RowDefinitions>
        <Grid.ColumnDefinitions>
            <ColumnDefinition/>
            <ColumnDefinition Width="*"/>
            <ColumnDefinition/>
        </Grid.ColumnDefinitions>
        <WrapPanel HorizontalAlignment="Stretch" Margin="0">
            <!--Some content here-->
            <TextBlock Text="{Binding Path=LastName}" TextWrapping="Wrap" FontSize="24"/>
            <TextBlock Text=", " TextWrapping="Wrap" FontSize="24"/>
            <TextBlock Text="{Binding Path=FirstName}" TextWrapping="Wrap" FontSize="24"/>

        </WrapPanel>
        <ListBox ItemsSource="{Binding Path=PhoneNumbers}" Grid.Column="2" d:DesignWidth="100" d:DesignHeight="50"
     Margin="8,0" Background="Transparent" BorderBrush="Transparent" IsHitTestVisible="False" HorizontalAlignment="Stretch"/>
    </Grid>
</DataTemplate>

또한 다음을 설정해야 했습니다.

HorizontalContentAlignment="Stretch"

하고 있는 에.ListBox.

<Grid.Width>
    <Binding Path="ActualWidth" 
             RelativeSource="{RelativeSource Mode=FindAncestor, AncestorType={x:Type ScrollContentPresenter}}" />
</Grid.Width>

좋아요, 당신이 가진 것은 다음과 같습니다.

0: 0°C:WrapPanel
1: » 1: »
2열:ListBox

당신이 원하는 것처럼 들립니다.WrapPanel 끝에, 왼쪽가리에자장,에▁on왼자리.ListBox오른쪽 가장자리에, 그리고 중간에 남은 것을 차지할 공간.

이를 위한 가장 쉬운 방법은 실제로 사용하는 것입니다.DockPanel조금도 아닌Grid.

<DockPanel>
    <WrapPanel DockPanel.Dock="Left"></WrapPanel>
    <ListBox DockPanel.Dock="Right"></ListBox>
</DockPanel>

이 작업을 수행하면 사이에 빈 공간이 남습니다.WrapPanel 리고그고.ListBox.

하고, 태의대연장고하설정, 을▁the▁extending,정설▁tae.ScrollViewer.HorizontalScrollBarVisibility="Hidden"당분간ListBox자식 컨트롤은 부모 너비를 사용하고 스크롤 막대는 표시하지 않습니다.

<ListBox Width="100" ScrollViewer.HorizontalScrollBarVisibility="Hidden">                
    <Label Content="{Binding Path=., Mode=OneWay}" HorizontalContentAlignment="Stretch" Height="30" Margin="-4,0,0,0" BorderThickness="0.5" BorderBrush="Black" FontFamily="Calibri" >
        <Label.Width>
            <Binding Path="Width" RelativeSource="{RelativeSource Mode=FindAncestor, AncestorType={x:Type ListBox}}" />
        </Label.Width>
    </Label>
</ListBox >

Grid으로 기적으로차합니다야지의 .ListBox이 기값때이기 입니다.ItemsPanel은 므로이이기 입니다.VirtualizingStackPanel내 생각에 당신은 변하지 않은 것 같습니다.ListBox.ItemsPanel.

요.ColumnDefinition 것들은 입니다.)"*"및 put ) 및 putHorizontalAlignment="Left"의 신의에WrapPanel그리고.HorizontalAlignment="Right"에서.ListBox전화번호를 위해서요.당신은 그것을 변경해야 할지도 모릅니다.ListBox 더 는 화전번더올정게위렬정기약보, 를들어예의간한하, 호를르바.DataTemplate그들을 위해.

당신이 경우할을 .Grid그러면 당신은 당신의 것을 바꿀 필요가 있습니다.ColumnDefinition대상:

    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="Auto"/>
        <ColumnDefinition Width="*"/>
        <ColumnDefinition Width="Auto"/>
    </Grid.ColumnDefinitions>

▁▁you▁don를 사용할 가 없다면Grid그러면 당신은 사용할 수 있습니다.DockPanel:

    <DockPanel>
        <WrapPanel DockPanel.Dock="Left">
            <!--Some content here-->
            <TextBlock Text="{Binding Path=LastName}" TextWrapping="Wrap" FontSize="24"/>
            <TextBlock Text=", " TextWrapping="Wrap" FontSize="24"/>
            <TextBlock Text="{Binding Path=FirstName}" TextWrapping="Wrap" FontSize="24"/>
        </WrapPanel>
        <ListBox DockPanel.Dock="Right" ItemsSource="{Binding Path=PhoneNumbers}" 
 Margin="8,0" Background="Transparent" BorderBrush="Transparent" IsHitTestVisible="False"/>
        <TextBlock />
    </DockPanel>

에 하십시오.TextBlock마지막에없는 모든 컨트롤"DockPanel.Dock" spacedefined를 .

태크의 답변은 잘 작동하며, 밴커터롬니의 답변대로 수평 스크롤바를 비활성화하여 성가신 크기 불일치를 없앨 수 있습니다.그러나 스크롤 막대가 필요하지 않을 때 제거하고 ListBox가 너무 작아지면 자동으로 활성화하는 두 가지 장점을 모두 사용하려면 다음 변환기를 사용할 수 있습니다.

/// <summary>
/// Value converter that adjusts the value of a double according to min and max limiting values, as well as an offset. These values are set by object configuration, handled in XAML resource definition.
/// </summary>
[ValueConversion(typeof(double), typeof(double))]
public sealed class DoubleLimiterConverter : IValueConverter
{
    /// <summary>
    /// Minimum value, if set. If not set, there is no minimum limit.
    /// </summary>
    public double? Min { get; set; }

    /// <summary>
    /// Maximum value, if set. If not set, there is no minimum limit.
    /// </summary>
    public double? Max { get; set; }

    /// <summary>
    /// Offset value to be applied after the limiting is done.
    /// </summary>
    public double Offset { get; set; }

    public static double _defaultFailureValue = 0;

    public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
    {
        if (value == null || !(value is double))
            return _defaultFailureValue;

        double dValue = (double)value;
        double minimum = Min.HasValue ? Min.Value : double.NegativeInfinity;
        double maximum = Max.HasValue ? Max.Value : double.PositiveInfinity;
        double retVal = dValue.LimitToRange(minimum, maximum) + Offset;
        return retVal;
    }

    public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture)
    {
        throw new NotImplementedException();
    }
}

그런 다음 원하는 max/min 값과 다른 답변에 언급된 것처럼 성가신 2픽셀 크기 불일치를 처리하기 위한 오프셋에 따라 XAML로 정의합니다.

<ListBox.Resources>
    <con:DoubleLimiterConverter x:Key="conDoubleLimiter" Min="450" Offset="-2"/>
</ListBox.Resources>

그런 다음 변환기를 너비 바인딩에 사용합니다.

<Grid.Width>
    <Binding Path="ActualWidth" RelativeSource="{RelativeSource Mode=FindAncestor, AncestorType={x:Type ScrollContentPresenter}}" Converter="{StaticResource conDoubleLimiter}"  />
</Grid.Width>

태크의 대답에 있는 방법은 가로 스크롤 막대를 강제로 사용합니다.이 문제는 수직 스크롤바 컨트롤의 너비만큼 그리드의 너비를 줄이는 컨버터를 추가하여 해결할 수 있습니다.

using System;
using System.Globalization;
using System.Windows;
using System.Windows.Data;
using System.Windows.Markup;

namespace Converters
{
    public class ListBoxItemWidthConverter : MarkupExtension, IValueConverter
    {
        private static ListBoxItemWidthConverter _instance;

        #region IValueConverter Members

        public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
        {
            return System.Convert.ToInt32(value) - SystemParameters.VerticalScrollBarWidth;
        }

        public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture)
        {
            throw new NotImplementedException();
        }

        #endregion

        public override object ProvideValue(IServiceProvider serviceProvider)
        {
            return _instance ?? (_instance = new ListBoxItemWidthConverter());
        }
    }
}

XAML의 루트 노드에 네임스페이스를 추가합니다.

xmlns:converters="clr-namespace:Converters"

그리고 컨버터를 사용하도록 그리드 폭을 업데이트합니다.

<Grid.Width>
    <Binding Path="ActualWidth" RelativeSource="{RelativeSource Mode=FindAncestor, AncestorType={x:Type ScrollContentPresenter}}" Converter="{converters:ListBoxItemWidthConverter}"/>
</Grid.Width>

언급URL : https://stackoverflow.com/questions/135375/how-do-i-make-a-wpf-data-template-fill-the-entire-width-of-the-listbox

반응형