以编程方式在集合视图中添加和删除列 xamarin.forms
adding and deleting column in collection view programmatically xamarin.forms
我有一个集合视图,其 DataTemplate
内有一个网格。这是代码:
xaml:
<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
x:Class="flyout.Page1">
<ContentPage.ToolbarItems >
<ToolbarItem Order="Secondary"
Text="logout"
Priority="2"
Clicked="ToolbarItem_Clicked"
/>
</ContentPage.ToolbarItems>
<ContentPage.Content>
<CollectionView x:Name="lstl"
SelectionChanged="lstl_SelectionChanged"
SelectionMode="Single"
>
<CollectionView.Header>
<Grid Padding="2" ColumnSpacing="1" RowSpacing="1" >
<Grid.RowDefinitions>
<RowDefinition Height="35" />
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="90" />
<ColumnDefinition Width="90" />
<ColumnDefinition Width="90"/>
<ColumnDefinition Width="100" />
<ColumnDefinition Width="100" />
<ColumnDefinition Width="90" />
</Grid.ColumnDefinitions>
<Label Grid.Column="0"
Text="name"
FontAttributes="Bold"
LineBreakMode="TailTruncation" />
<Label Grid.Column="1"
Text="code"
FontAttributes="Bold"
LineBreakMode="TailTruncation" />
<Label
Grid.Column="2"
Text="price"
LineBreakMode="TailTruncation"
FontAttributes="Italic"
/>
<Label
Grid.Column="3"
Text="quantity"
LineBreakMode="TailTruncation"
FontAttributes="Italic"
/>
<Label
Grid.Column="4"
Text="unit"
LineBreakMode="TailTruncation"
FontAttributes="Italic"
/>
<Label
Grid.Column="5"
Text="place"
LineBreakMode="TailTruncation"
FontAttributes="Italic"
/>
</Grid>
</CollectionView.Header>
<CollectionView.ItemTemplate>
<DataTemplate >
<Grid x:Name="MyGrid" Padding="0" ColumnSpacing="-1" RowSpacing="-1" >
<Grid.RowDefinitions>
<RowDefinition Height="40" />
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="0.5*" x:Name="code" />
<ColumnDefinition Width="0.7*" />
<ColumnDefinition Width="0.7*" />
<ColumnDefinition Width="0.7*" />
<ColumnDefinition Width="0.3*" />
<ColumnDefinition Width="0.7*" />
</Grid.ColumnDefinitions>
<StackLayout Grid.Column="0" Orientation="Vertical" >
<BoxView HeightRequest="1" Color="Black" />
<StackLayout Orientation="Horizontal">
<BoxView
Margin="0,-6,0,0"
VerticalOptions="FillAndExpand"
HorizontalOptions="Start"
WidthRequest="1"
Color="Black"/>
<Label HorizontalOptions="Center"
x:Name="col1"
TextColor="#ffc40c"
Text="{Binding name}"
FontAttributes="Bold"
LineBreakMode="TailTruncation" />
</StackLayout>
</StackLayout>
<StackLayout Grid.Column="1" Orientation="Vertical">
<BoxView HeightRequest="1" Color="Black" />
<StackLayout HeightRequest="40" Orientation="Horizontal">
<BoxView Margin="0,-6,0,0"
VerticalOptions="FillAndExpand"
HorizontalOptions="Start"
WidthRequest="1"
Color="Black"/>
<Label HorizontalOptions="Center"
TextColor="#ffc40c"
Text="{Binding name}"
FontAttributes="Bold"
LineBreakMode="TailTruncation" />
</StackLayout>
</StackLayout>
<StackLayout Grid.Column="2" Orientation="Vertical">
<BoxView HeightRequest="1" Color="Black" />
<StackLayout HeightRequest="40" Orientation="Horizontal">
<BoxView Margin="0,-6,0,0"
VerticalOptions="FillAndExpand"
HorizontalOptions="Start"
WidthRequest="1"
Color="Black"/>
<Label HorizontalOptions="Center"
TextColor="#ffc40c"
Text="{Binding name}"
FontAttributes="Bold"
LineBreakMode="TailTruncation" />
</StackLayout>
</StackLayout>
<StackLayout Grid.Column="3" Orientation="Vertical">
<BoxView HeightRequest="1" Color="Black" />
<StackLayout HeightRequest="40" Orientation="Horizontal">
<BoxView Margin="0,-6,0,0"
VerticalOptions="FillAndExpand"
HorizontalOptions="Start"
WidthRequest="1"
Color="Black"/>
<Label HorizontalOptions="Center"
TextColor="#ffc40c"
Text="{Binding name}"
FontAttributes="Bold"
LineBreakMode="TailTruncation" />
</StackLayout>
</StackLayout>
<StackLayout Grid.Column="4" Orientation="Vertical">
<BoxView HeightRequest="1" Color="Black" />
<StackLayout HeightRequest="40" Orientation="Horizontal">
<BoxView Margin="0,-6,0,0"
VerticalOptions="FillAndExpand"
HorizontalOptions="Start"
WidthRequest="1"
Color="Black"/>
<Label HorizontalOptions="Center"
TextColor="#ffc40c"
Text="{Binding name}"
FontAttributes="Bold"
LineBreakMode="TailTruncation" />
</StackLayout>
</StackLayout>
<StackLayout Grid.Column="5" Orientation="Vertical">
<BoxView HeightRequest="1" Color="Black" />
<StackLayout HeightRequest="40" Orientation="Horizontal">
<BoxView Margin="0,-6,0,0"
VerticalOptions="FillAndExpand"
HorizontalOptions="Start"
WidthRequest="1"
Color="Black"/>
<Label HorizontalOptions="Center"
TextColor="#ffc40c"
Text="{Binding name}"
FontAttributes="Bold"
LineBreakMode="TailTruncation" />
</StackLayout>
</StackLayout>
</Grid>
</DataTemplate>
</CollectionView.ItemTemplate>
</CollectionView>
</ContentPage.Content>
</ContentPage>
这是一个试用代码。我想在集合视图外添加一个按钮,该按钮将删除或添加一列。我想按名称访问网格,但我发现无法按名称访问数据模板内的任何视图。我搜索并发现了类似这样的内容:http://5.9.10.113/65181774/xamarin-forms-how-to-change-ui-label-text-inside-datatemplate 但我实际上并不了解所做的事情。谁能帮我弄清楚这样做所需的步骤?提前致谢。
您可以在按钮点击事件中重写 header 和数据模板,如下面的代码。
private void Button_Clicked(object sender, EventArgs e)
{
var header_grid = new Grid { Padding = 2, ColumnSpacing = 1, RowSpacing = 1 };
header_grid.RowDefinitions.Add(new RowDefinition { Height = 35 });
header_grid.ColumnDefinitions.Add(new ColumnDefinition { Width = new GridLength(0.7, GridUnitType.Star) });
header_grid.ColumnDefinitions.Add(new ColumnDefinition { Width = new GridLength(0.7, GridUnitType.Star) });
header_grid.ColumnDefinitions.Add(new ColumnDefinition { Width = new GridLength(0.7, GridUnitType.Star) });
header_grid.ColumnDefinitions.Add(new ColumnDefinition { Width = new GridLength(0.3, GridUnitType.Star) });
header_grid.ColumnDefinitions.Add(new ColumnDefinition { Width = new GridLength(0.7, GridUnitType.Star) });
Label code = new Label { FontAttributes = FontAttributes.Bold };
code.Text = "code";
Label price = new Label { FontAttributes = FontAttributes.Bold };
price.Text = "price";
Label quality = new Label { FontAttributes = FontAttributes.Bold };
quality.Text = "quality";
Label unit = new Label { FontAttributes = FontAttributes.Bold };
unit.Text = "unit";
Label place = new Label { FontAttributes = FontAttributes.Bold };
place.Text = "place";
header_grid.Children.Add(code, 0, 0);
header_grid.Children.Add(price, 1, 0);
header_grid.Children.Add(quality, 2, 0);
header_grid.Children.Add(unit, 3, 0);
header_grid.Children.Add(place, 4, 0);
lstl.Header = header_grid;
lstl.ItemTemplate = new DataTemplate(() =>
{
Grid grid1 = new Grid { Padding = 0, ColumnSpacing = -1, RowSpacing = -1 };
grid1.RowDefinitions.Add(new RowDefinition { Height = 40 });
grid1.ColumnDefinitions.Add(new ColumnDefinition { Width = new GridLength(0.7, GridUnitType.Star) });
grid1.ColumnDefinitions.Add(new ColumnDefinition { Width = new GridLength(0.7, GridUnitType.Star) });
grid1.ColumnDefinitions.Add(new ColumnDefinition { Width = new GridLength(0.7, GridUnitType.Star) });
grid1.ColumnDefinitions.Add(new ColumnDefinition { Width = new GridLength(0.3, GridUnitType.Star) });
grid1.ColumnDefinitions.Add(new ColumnDefinition { Width = new GridLength(0.7, GridUnitType.Star) });
Label label_code = new Label { HorizontalOptions = LayoutOptions.Center };
label_code.SetBinding(Label.TextProperty, "name");
Label label_price = new Label { HorizontalOptions = LayoutOptions.Center };
label_price.SetBinding(Label.TextProperty, "name");
Label label_quality = new Label { HorizontalOptions = LayoutOptions.Center };
label_quality.SetBinding(Label.TextProperty, "name");
Label label_unit = new Label { HorizontalOptions = LayoutOptions.Center };
label_unit.SetBinding(Label.TextProperty, "name");
Label label_place = new Label { HorizontalOptions = LayoutOptions.Center };
label_place.SetBinding(Label.TextProperty, "name");
grid1.Children.Add(label_code, 0, 0);
grid1.Children.Add(label_price, 1, 0);
grid1.Children.Add(label_quality, 2, 0);
grid1.Children.Add(label_unit, 3, 0);
grid1.Children.Add(label_place, 4, 0);
return grid1;
});
}
我只是更改了模板。您需要在后面的代码中添加更多详细信息。
我有一个集合视图,其 DataTemplate
内有一个网格。这是代码:
xaml:
<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
x:Class="flyout.Page1">
<ContentPage.ToolbarItems >
<ToolbarItem Order="Secondary"
Text="logout"
Priority="2"
Clicked="ToolbarItem_Clicked"
/>
</ContentPage.ToolbarItems>
<ContentPage.Content>
<CollectionView x:Name="lstl"
SelectionChanged="lstl_SelectionChanged"
SelectionMode="Single"
>
<CollectionView.Header>
<Grid Padding="2" ColumnSpacing="1" RowSpacing="1" >
<Grid.RowDefinitions>
<RowDefinition Height="35" />
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="90" />
<ColumnDefinition Width="90" />
<ColumnDefinition Width="90"/>
<ColumnDefinition Width="100" />
<ColumnDefinition Width="100" />
<ColumnDefinition Width="90" />
</Grid.ColumnDefinitions>
<Label Grid.Column="0"
Text="name"
FontAttributes="Bold"
LineBreakMode="TailTruncation" />
<Label Grid.Column="1"
Text="code"
FontAttributes="Bold"
LineBreakMode="TailTruncation" />
<Label
Grid.Column="2"
Text="price"
LineBreakMode="TailTruncation"
FontAttributes="Italic"
/>
<Label
Grid.Column="3"
Text="quantity"
LineBreakMode="TailTruncation"
FontAttributes="Italic"
/>
<Label
Grid.Column="4"
Text="unit"
LineBreakMode="TailTruncation"
FontAttributes="Italic"
/>
<Label
Grid.Column="5"
Text="place"
LineBreakMode="TailTruncation"
FontAttributes="Italic"
/>
</Grid>
</CollectionView.Header>
<CollectionView.ItemTemplate>
<DataTemplate >
<Grid x:Name="MyGrid" Padding="0" ColumnSpacing="-1" RowSpacing="-1" >
<Grid.RowDefinitions>
<RowDefinition Height="40" />
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="0.5*" x:Name="code" />
<ColumnDefinition Width="0.7*" />
<ColumnDefinition Width="0.7*" />
<ColumnDefinition Width="0.7*" />
<ColumnDefinition Width="0.3*" />
<ColumnDefinition Width="0.7*" />
</Grid.ColumnDefinitions>
<StackLayout Grid.Column="0" Orientation="Vertical" >
<BoxView HeightRequest="1" Color="Black" />
<StackLayout Orientation="Horizontal">
<BoxView
Margin="0,-6,0,0"
VerticalOptions="FillAndExpand"
HorizontalOptions="Start"
WidthRequest="1"
Color="Black"/>
<Label HorizontalOptions="Center"
x:Name="col1"
TextColor="#ffc40c"
Text="{Binding name}"
FontAttributes="Bold"
LineBreakMode="TailTruncation" />
</StackLayout>
</StackLayout>
<StackLayout Grid.Column="1" Orientation="Vertical">
<BoxView HeightRequest="1" Color="Black" />
<StackLayout HeightRequest="40" Orientation="Horizontal">
<BoxView Margin="0,-6,0,0"
VerticalOptions="FillAndExpand"
HorizontalOptions="Start"
WidthRequest="1"
Color="Black"/>
<Label HorizontalOptions="Center"
TextColor="#ffc40c"
Text="{Binding name}"
FontAttributes="Bold"
LineBreakMode="TailTruncation" />
</StackLayout>
</StackLayout>
<StackLayout Grid.Column="2" Orientation="Vertical">
<BoxView HeightRequest="1" Color="Black" />
<StackLayout HeightRequest="40" Orientation="Horizontal">
<BoxView Margin="0,-6,0,0"
VerticalOptions="FillAndExpand"
HorizontalOptions="Start"
WidthRequest="1"
Color="Black"/>
<Label HorizontalOptions="Center"
TextColor="#ffc40c"
Text="{Binding name}"
FontAttributes="Bold"
LineBreakMode="TailTruncation" />
</StackLayout>
</StackLayout>
<StackLayout Grid.Column="3" Orientation="Vertical">
<BoxView HeightRequest="1" Color="Black" />
<StackLayout HeightRequest="40" Orientation="Horizontal">
<BoxView Margin="0,-6,0,0"
VerticalOptions="FillAndExpand"
HorizontalOptions="Start"
WidthRequest="1"
Color="Black"/>
<Label HorizontalOptions="Center"
TextColor="#ffc40c"
Text="{Binding name}"
FontAttributes="Bold"
LineBreakMode="TailTruncation" />
</StackLayout>
</StackLayout>
<StackLayout Grid.Column="4" Orientation="Vertical">
<BoxView HeightRequest="1" Color="Black" />
<StackLayout HeightRequest="40" Orientation="Horizontal">
<BoxView Margin="0,-6,0,0"
VerticalOptions="FillAndExpand"
HorizontalOptions="Start"
WidthRequest="1"
Color="Black"/>
<Label HorizontalOptions="Center"
TextColor="#ffc40c"
Text="{Binding name}"
FontAttributes="Bold"
LineBreakMode="TailTruncation" />
</StackLayout>
</StackLayout>
<StackLayout Grid.Column="5" Orientation="Vertical">
<BoxView HeightRequest="1" Color="Black" />
<StackLayout HeightRequest="40" Orientation="Horizontal">
<BoxView Margin="0,-6,0,0"
VerticalOptions="FillAndExpand"
HorizontalOptions="Start"
WidthRequest="1"
Color="Black"/>
<Label HorizontalOptions="Center"
TextColor="#ffc40c"
Text="{Binding name}"
FontAttributes="Bold"
LineBreakMode="TailTruncation" />
</StackLayout>
</StackLayout>
</Grid>
</DataTemplate>
</CollectionView.ItemTemplate>
</CollectionView>
</ContentPage.Content>
</ContentPage>
这是一个试用代码。我想在集合视图外添加一个按钮,该按钮将删除或添加一列。我想按名称访问网格,但我发现无法按名称访问数据模板内的任何视图。我搜索并发现了类似这样的内容:http://5.9.10.113/65181774/xamarin-forms-how-to-change-ui-label-text-inside-datatemplate 但我实际上并不了解所做的事情。谁能帮我弄清楚这样做所需的步骤?提前致谢。
您可以在按钮点击事件中重写 header 和数据模板,如下面的代码。
private void Button_Clicked(object sender, EventArgs e)
{
var header_grid = new Grid { Padding = 2, ColumnSpacing = 1, RowSpacing = 1 };
header_grid.RowDefinitions.Add(new RowDefinition { Height = 35 });
header_grid.ColumnDefinitions.Add(new ColumnDefinition { Width = new GridLength(0.7, GridUnitType.Star) });
header_grid.ColumnDefinitions.Add(new ColumnDefinition { Width = new GridLength(0.7, GridUnitType.Star) });
header_grid.ColumnDefinitions.Add(new ColumnDefinition { Width = new GridLength(0.7, GridUnitType.Star) });
header_grid.ColumnDefinitions.Add(new ColumnDefinition { Width = new GridLength(0.3, GridUnitType.Star) });
header_grid.ColumnDefinitions.Add(new ColumnDefinition { Width = new GridLength(0.7, GridUnitType.Star) });
Label code = new Label { FontAttributes = FontAttributes.Bold };
code.Text = "code";
Label price = new Label { FontAttributes = FontAttributes.Bold };
price.Text = "price";
Label quality = new Label { FontAttributes = FontAttributes.Bold };
quality.Text = "quality";
Label unit = new Label { FontAttributes = FontAttributes.Bold };
unit.Text = "unit";
Label place = new Label { FontAttributes = FontAttributes.Bold };
place.Text = "place";
header_grid.Children.Add(code, 0, 0);
header_grid.Children.Add(price, 1, 0);
header_grid.Children.Add(quality, 2, 0);
header_grid.Children.Add(unit, 3, 0);
header_grid.Children.Add(place, 4, 0);
lstl.Header = header_grid;
lstl.ItemTemplate = new DataTemplate(() =>
{
Grid grid1 = new Grid { Padding = 0, ColumnSpacing = -1, RowSpacing = -1 };
grid1.RowDefinitions.Add(new RowDefinition { Height = 40 });
grid1.ColumnDefinitions.Add(new ColumnDefinition { Width = new GridLength(0.7, GridUnitType.Star) });
grid1.ColumnDefinitions.Add(new ColumnDefinition { Width = new GridLength(0.7, GridUnitType.Star) });
grid1.ColumnDefinitions.Add(new ColumnDefinition { Width = new GridLength(0.7, GridUnitType.Star) });
grid1.ColumnDefinitions.Add(new ColumnDefinition { Width = new GridLength(0.3, GridUnitType.Star) });
grid1.ColumnDefinitions.Add(new ColumnDefinition { Width = new GridLength(0.7, GridUnitType.Star) });
Label label_code = new Label { HorizontalOptions = LayoutOptions.Center };
label_code.SetBinding(Label.TextProperty, "name");
Label label_price = new Label { HorizontalOptions = LayoutOptions.Center };
label_price.SetBinding(Label.TextProperty, "name");
Label label_quality = new Label { HorizontalOptions = LayoutOptions.Center };
label_quality.SetBinding(Label.TextProperty, "name");
Label label_unit = new Label { HorizontalOptions = LayoutOptions.Center };
label_unit.SetBinding(Label.TextProperty, "name");
Label label_place = new Label { HorizontalOptions = LayoutOptions.Center };
label_place.SetBinding(Label.TextProperty, "name");
grid1.Children.Add(label_code, 0, 0);
grid1.Children.Add(label_price, 1, 0);
grid1.Children.Add(label_quality, 2, 0);
grid1.Children.Add(label_unit, 3, 0);
grid1.Children.Add(label_place, 4, 0);
return grid1;
});
}
我只是更改了模板。您需要在后面的代码中添加更多详细信息。