我可以将 Syncfusion SfTreeView 的大小设置为动态吗?
Can I set the size of the Syncfusion SfTreeView to dynamic?
我把SfTreeView放在一个SfExpander里面,TreeView在下面占了很多space。[enter image description here][1]
我尝试放入网格并将高度设置为“自动”,但没有成功。
[1]: https://i.stack.imgur.com/kDP3l.png
<expander:SfExpander DynamicSizeMode="Content" IsExpanded="False">
<expander:SfExpander.Header>
<Label TextColor="#495F6E" Text="TreeView list" FontSize="16"
</expander:SfExpander.Header>
<expander:SfExpander.Content>
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="Auto"></RowDefinition>
</Grid.RowDefinitions>
<treeview:SfTreeView x:Name="treeView2"
ItemHeight="34"
ItemsSource="{Binding ImageNodeInfo}">
<treeview:SfTreeView.ItemTemplate>
<DataTemplate>
<Grid x:Name="grid" Padding="2,2,2,2" RowSpacing="0" >
<Grid.RowDefinitions>
<RowDefinition Height="Auto"/>
<RowDefinition Height="1"/>
</Grid.RowDefinitions>
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="{Binding Level, Converter={StaticResource IndentationConverter}}" />
<ColumnDefinition Width="30" />
<ColumnDefinition Width="60" />
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
<Image Grid.Column="1" Source="{Binding IsExpanded,Converter={StaticResource ExpanderIconConverter}}"
IsVisible="{Binding HasChildNodes,Converter={StaticResource ExpanderIconVisibilityConverter}}"
VerticalOptions="Center"
HorizontalOptions="Center"
HeightRequest="15"
WidthRequest="15"/>
<Image Grid.Column="2" Source="{Binding Content.ImageIcon}" VerticalOptions="Center" HorizontalOptions="Start" HeightRequest="16" WidthRequest="60"/>
<Grid Grid.Column="3" RowSpacing="1" Padding="1,0,0,0" VerticalOptions="Center">
<Label LineBreakMode="NoWrap" Text="{Binding Content.ItemName}" VerticalTextAlignment="Center" FontSize="Body" FontAttributes="Bold"/>
</Grid>
</Grid>
<BoxView HeightRequest="1" BackgroundColor="Gray" Grid.Row="1"/>
</Grid>
</DataTemplate>
</treeview:SfTreeView.ItemTemplate>
</treeview:SfTreeView>
</Grid>
</expander:SfExpander.Content>
</expander:SfExpander>
我们已经检查了我们这边报告的查询“如何设置动态高度”。我们想通知您,TreeView 将加载视图大小。如果想自定义TreeView的高度,可以根据item大小给TreeView设置HeightRequest。请参考以下代码片段来实现您的要求,
Xaml: 为 SfTreeView 使用 EventToCommand 行为,为 QueryNodeSize 事件使用命令。绑定TreeView的HeightRequest,根据节点更新treeview的高度。
<syncfusion:SfTreeView x:Name="treeView"
ItemHeight="40"
HeightRequest="{Binding TreeViewHeight}"
ChildPropertyName="SubFiles"
ItemTemplateContextType="Node"
AutoExpandMode="AllNodesExpanded"
ItemsSource="{Binding ImageNodeInfo}"
BackgroundColor="Beige">
<syncfusion:SfTreeView.Behaviors>
<local:EventToCommandBehavior EventName="QueryNodeSize" Command="{Binding Path=BindingContext.QueryNodeSizeCommand, Source={x:Reference treeView}}"/>
</syncfusion:SfTreeView.Behaviors>
…
</syncfusion:SfTreeView>
ViewModel: Create Command with QueryNodeSizeEventArgs.
private double treeViewHeight = -1;
//Property to set TreeView height.
public double TreeViewHeight
{
get { return treeViewHeight; }
set
{
treeViewHeight = value;
this.RaisedOnPropertyChanged("TreeViewHeight");
}
}
//Command for QueryNodeSize event.
public Command<QueryNodeSizeEventArgs> QueryNodeSizeCommand { get; set; }
public FileManagerViewModel()
{
//Initialize the command.
QueryNodeSizeCommand = new Command<QueryNodeSizeEventArgs>(QueryNodeSizeMethod);
}
/// <summary>
/// Command method to calculate the TreeView height.
/// </summary>
/// <param name="args">Argument which holds the information of the node.</param>
private void QueryNodeSizeMethod(QueryNodeSizeEventArgs args)
{
var item = args.Node.Content as FileManager;
if (!item.IsHandled)
{
this.TreeViewHeight += args.Height;
item.IsHandled = true;
}
}
我们已根据您的要求附上了可行的样品。您可以从以下 link,
中找到它们
样本:https://www.syncfusion.com/downloads/support/directtrac/general/ze/TreeViewXamarin-1814245514
此致,
SaiGanesh Sakthivel
我把SfTreeView放在一个SfExpander里面,TreeView在下面占了很多space。[enter image description here][1]
我尝试放入网格并将高度设置为“自动”,但没有成功。 [1]: https://i.stack.imgur.com/kDP3l.png
<expander:SfExpander DynamicSizeMode="Content" IsExpanded="False">
<expander:SfExpander.Header>
<Label TextColor="#495F6E" Text="TreeView list" FontSize="16"
</expander:SfExpander.Header>
<expander:SfExpander.Content>
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="Auto"></RowDefinition>
</Grid.RowDefinitions>
<treeview:SfTreeView x:Name="treeView2"
ItemHeight="34"
ItemsSource="{Binding ImageNodeInfo}">
<treeview:SfTreeView.ItemTemplate>
<DataTemplate>
<Grid x:Name="grid" Padding="2,2,2,2" RowSpacing="0" >
<Grid.RowDefinitions>
<RowDefinition Height="Auto"/>
<RowDefinition Height="1"/>
</Grid.RowDefinitions>
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="{Binding Level, Converter={StaticResource IndentationConverter}}" />
<ColumnDefinition Width="30" />
<ColumnDefinition Width="60" />
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
<Image Grid.Column="1" Source="{Binding IsExpanded,Converter={StaticResource ExpanderIconConverter}}"
IsVisible="{Binding HasChildNodes,Converter={StaticResource ExpanderIconVisibilityConverter}}"
VerticalOptions="Center"
HorizontalOptions="Center"
HeightRequest="15"
WidthRequest="15"/>
<Image Grid.Column="2" Source="{Binding Content.ImageIcon}" VerticalOptions="Center" HorizontalOptions="Start" HeightRequest="16" WidthRequest="60"/>
<Grid Grid.Column="3" RowSpacing="1" Padding="1,0,0,0" VerticalOptions="Center">
<Label LineBreakMode="NoWrap" Text="{Binding Content.ItemName}" VerticalTextAlignment="Center" FontSize="Body" FontAttributes="Bold"/>
</Grid>
</Grid>
<BoxView HeightRequest="1" BackgroundColor="Gray" Grid.Row="1"/>
</Grid>
</DataTemplate>
</treeview:SfTreeView.ItemTemplate>
</treeview:SfTreeView>
</Grid>
</expander:SfExpander.Content>
</expander:SfExpander>
我们已经检查了我们这边报告的查询“如何设置动态高度”。我们想通知您,TreeView 将加载视图大小。如果想自定义TreeView的高度,可以根据item大小给TreeView设置HeightRequest。请参考以下代码片段来实现您的要求,
Xaml: 为 SfTreeView 使用 EventToCommand 行为,为 QueryNodeSize 事件使用命令。绑定TreeView的HeightRequest,根据节点更新treeview的高度。
<syncfusion:SfTreeView x:Name="treeView"
ItemHeight="40"
HeightRequest="{Binding TreeViewHeight}"
ChildPropertyName="SubFiles"
ItemTemplateContextType="Node"
AutoExpandMode="AllNodesExpanded"
ItemsSource="{Binding ImageNodeInfo}"
BackgroundColor="Beige">
<syncfusion:SfTreeView.Behaviors>
<local:EventToCommandBehavior EventName="QueryNodeSize" Command="{Binding Path=BindingContext.QueryNodeSizeCommand, Source={x:Reference treeView}}"/>
</syncfusion:SfTreeView.Behaviors>
…
</syncfusion:SfTreeView>
ViewModel: Create Command with QueryNodeSizeEventArgs.
private double treeViewHeight = -1;
//Property to set TreeView height.
public double TreeViewHeight
{
get { return treeViewHeight; }
set
{
treeViewHeight = value;
this.RaisedOnPropertyChanged("TreeViewHeight");
}
}
//Command for QueryNodeSize event.
public Command<QueryNodeSizeEventArgs> QueryNodeSizeCommand { get; set; }
public FileManagerViewModel()
{
//Initialize the command.
QueryNodeSizeCommand = new Command<QueryNodeSizeEventArgs>(QueryNodeSizeMethod);
}
/// <summary>
/// Command method to calculate the TreeView height.
/// </summary>
/// <param name="args">Argument which holds the information of the node.</param>
private void QueryNodeSizeMethod(QueryNodeSizeEventArgs args)
{
var item = args.Node.Content as FileManager;
if (!item.IsHandled)
{
this.TreeViewHeight += args.Height;
item.IsHandled = true;
}
}
我们已根据您的要求附上了可行的样品。您可以从以下 link,
中找到它们样本:https://www.syncfusion.com/downloads/support/directtrac/general/ze/TreeViewXamarin-1814245514
此致, SaiGanesh Sakthivel