i have a collection view with a grid inside its DataTemplate. here is the code:
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>
this is a trial code. i want to add a button outside the collection view that would remove or add a column to it. i thought of accessing the grid by name but i found out that it is not possible to access any view inside a datatemplate by name. i searched and found something like this: http://5.9.10.113/65181774/xamarin-forms-how-to-change-ui-label-text-inside-datatemplate but i didn't actually understand what was done. would anyone help me figure out the steps needed to do so? thanks in advance.
You could rewrite the header and datatemplate like the code below in button click event.
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;
});
}
I just change the template. You need to add more details in code behind.