Как расширить заголовки объекта вкладки WPF для порождения ширины элемента управления
Предполагая, что вам нужен массив объектов для вашего вывода, вы можете .map Object.entries вашего ввода:
const obj = {
"ABC":{"minValue":0,"maxValue":5},
"XYZ":{"minValue":0,"maxValue":5},
"PQR":{"minValue":0,"maxValue":5},
"overall":{"minValue":0,"maxValue":5}
};
const arr = Object.entries(obj).map(([type, { minValue, maxValue }]) => ({
type,
minValue,
maxValue
}));
console.log(arr);4 ответа
Я взял пример Джордана и внес в него некоторые изменения. Эта версия должна работать для любого количества вкладок:
namespace WpfApplication1.Converters
{
public class TabSizeConverter : IMultiValueConverter
{
public object Convert(object[] values, Type targetType, object parameter,
System.Globalization.CultureInfo culture)
{
TabControl tabControl = values[0] as TabControl;
double width = tabControl.ActualWidth / tabControl.Items.Count;
//Subtract 1, otherwise we could overflow to two rows.
return (width <= 1) ? 0 : (width - 1);
}
public object[] ConvertBack(object value, Type[] targetTypes, object parameter,
System.Globalization.CultureInfo culture)
{
throw new NotSupportedException();
}
}
}
То же пространство имен в xaml:
xmlns:local="clr-namespace:WpfApplication1.Converters"
И это заставит все вкладки использовать его:
<Window.Resources>
<local:TabSizeConverter x:Key="tabSizeConverter" />
<Style TargetType="{x:Type TabItem}">
<Setter Property="Width">
<Setter.Value>
<MultiBinding Converter="{StaticResource tabSizeConverter}">
<Binding RelativeSource="{RelativeSource Mode=FindAncestor,
AncestorType={x:Type TabControl}}" />
<Binding RelativeSource="{RelativeSource Mode=FindAncestor,
AncestorType={x:Type TabControl}}" Path="ActualWidth" />
</MultiBinding>
</Setter.Value>
</Setter>
</Style>
</Window.Resources>
Я не знаю, будет ли это работать на вкладки, но каждый раз, когда я должен был расширить что-либо для заполнения контейнера, я использовал ViewBox. Это - вид вещи, которую Вы ищете?
Это возможно путем привязки ширины с ActualWidth родительского управления вкладкой как показано ниже.
Я перенес его в стиль для применения ко всем вкладкам.
<Grid>
<Grid.Resources>
<Style TargetType="TabItem">
<Setter Property="Width" Value="{Binding
Path=ActualWidth,
RelativeSource={RelativeSource
Mode=FindAncestor,
AncestorType={x:Type TabControl}}}"/>
</Style>
</Grid.Resources>
<TabControl>
<TabItem Header="Page3"/>
<TabItem Header="Page2"/>
<TabItem Header="Page3"/>
</TabControl>
</Grid>
Я смог сделать это с помощью конвертера следующим образом:
namespace WpfApplication1.Converters
{
public class SizeConverter : IValueConverter
{
#region IValueConverter Members
public object Convert(object value, Type targetType, object parameter,
System.Globalization.CultureInfo culture)
{
double width = Double.Parse(value.ToString());
//Subtract 1, otherwise we could overflow to two rows.
return .25 * width - 1;
}
public object ConvertBack(object value, Type targetType, object parameter,
System.Globalization.CultureInfo culture)
{
throw new NotSupportedException();
}
#endregion
}
}
Затем добавив пространство имен в мой xaml:
xmlns:local="clr-namespace:WpfApplication1.Converters"
Затем заставив все TabItems использовать конвертер:
<Window.Resources>
<local:SizeConverter x:Key="sizeConverter" />
<Style TargetType="{x:Type TabItem}">
<Setter Property="Width" Value="{Binding ElementName=x_Grid, Path=ActualWidth, Converter={StaticResource sizeConverter}}" />
</Style>
</Window.Resources>
x_Grid это x: имя родительского элемента, для которого вкладки должны быть 1/4, если это имеет смысл.