Look the image below
![]()
and below my code in c#
[XamlCompilation(XamlCompilationOptions.Compile)]
public partial class MainPageItens : ContentPage
{
ObservableCollection _data { get; set; }
public int IdOrcamento { get; set; }
public MainPageItens()
{
InitializeComponent();
}
public MainPageItens(int idorcamento)
{
InitializeComponent();
this.IdOrcamento = idorcamento;
_data = new ObservableCollection<ItensLib>();
// Crete a grid for "title"
Grid grid = CreateGrid();
grid.Children.Add(new Label { Text = "Produto", TextColor = Color.Red, VerticalOptions = LayoutOptions.Center, HorizontalOptions = LayoutOptions.Center }, 0, 1, 0, 1);
grid.Children.Add(SeparatorV(), 1, 2, 0, 1);
grid.Children.Add(new Label { Text = "Qtde", TextColor = Color.Red, VerticalOptions = LayoutOptions.Center, HorizontalOptions = LayoutOptions.Center }, 2, 3, 0, 1);
grid.Children.Add(SeparatorV(), 3, 4, 0, 1);
grid.Children.Add(new Label { Text = "Unitário", TextColor = Color.Red, VerticalOptions = LayoutOptions.Center, HorizontalOptions = LayoutOptions.Center }, 4, 5, 0, 1);
grid.Children.Add(SeparatorV(), 5, 6, 0, 1);
grid.Children.Add(new Label { Text = "Custo", TextColor = Color.Red, VerticalOptions = LayoutOptions.Center, HorizontalOptions = LayoutOptions.Center }, 6, 7, 0, 1);
grid.Children.Add(SeparatorV(), 7, 8, 0, 1);
grid.Children.Add(new Label { Text = "Custo Dia", TextColor = Color.Red, VerticalOptions = LayoutOptions.Center, HorizontalOptions = LayoutOptions.Center }, 8, 9, 0, 1);
grid.Children.Add(SeparatorV(), 9, 10, 0, 1);
grid.Children.Add(new Label { Text = "Ult. Vencto", TextColor = Color.Red, VerticalOptions = LayoutOptions.Center, HorizontalOptions = LayoutOptions.Center }, 10, 11, 0, 1);
grid.Children.Add(SeparatorV(), 11, 12, 0, 1);
grid.Children.Add(new Label { Text = "Total", TextColor = Color.Red, VerticalOptions = LayoutOptions.Center, HorizontalOptions = LayoutOptions.Center }, 12, 13, 0, 1);
grid.Children.Add(SeparatorV(), 13, 14, 0, 1);
grid.Children.Add(SeparatorH(), 0, 5, 1, 2);
// Create the ListView to visualize my data
ListView lv = new ListView() { HasUnevenRows = true, SeparatorVisibility = SeparatorVisibility.None };
lv.ItemsSource = _data;
lv.ItemTemplate = new DataTemplate(typeof(ListViewTemplateGrid));
StackLayout sl = new StackLayout() { Children = { grid, lv }, Spacing = 0 };
this.Content = sl;
}
static Grid CreateGrid()
{
Grid grid = new Grid() { RowSpacing = 0, ColumnSpacing = 0 };
// Define row
RowDefinition rd = new RowDefinition() { Height = new GridLength(1, GridUnitType.Auto) };
RowDefinition rdSeparator = new RowDefinition() { Height = new GridLength(1, GridUnitType.Auto) };
// Define columns (one for every property I have to visualize)
ColumnDefinition cdProduto = new ColumnDefinition() { Width = new GridLength(2, GridUnitType.Star) };
ColumnDefinition cdQtde = new ColumnDefinition() { Width = new GridLength(1, GridUnitType.Star) };
ColumnDefinition cdUnitario = new ColumnDefinition() { Width = new GridLength(1, GridUnitType.Star) };
ColumnDefinition cdCusto = new ColumnDefinition() { Width = new GridLength(2, GridUnitType.Star) };
ColumnDefinition cdCustoDia = new ColumnDefinition() { Width = new GridLength(1, GridUnitType.Star) };
ColumnDefinition cdUltVencto = new ColumnDefinition() { Width = new GridLength(1, GridUnitType.Star) };
ColumnDefinition cdTotal = new ColumnDefinition() { Width = new GridLength(2, GridUnitType.Star) };
// Add row and columns to grid
grid.RowDefinitions.Add(rd);
grid.RowDefinitions.Add(rdSeparator);
grid.ColumnDefinitions.Add(cdProduto);
grid.ColumnDefinitions.Add(new ColumnDefinition() { Width = new GridLength(2, GridUnitType.Absolute) }); // Separator
grid.ColumnDefinitions.Add(cdQtde);
grid.ColumnDefinitions.Add(new ColumnDefinition() { Width = new GridLength(2, GridUnitType.Absolute) }); // Separator
grid.ColumnDefinitions.Add(cdUnitario);
grid.ColumnDefinitions.Add(cdCusto);
grid.ColumnDefinitions.Add(new ColumnDefinition() { Width = new GridLength(2, GridUnitType.Absolute) }); // Separator
grid.ColumnDefinitions.Add(cdCustoDia);
grid.ColumnDefinitions.Add(new ColumnDefinition() { Width = new GridLength(2, GridUnitType.Absolute) }); // Separator
grid.ColumnDefinitions.Add(cdUltVencto);
grid.ColumnDefinitions.Add(new ColumnDefinition() { Width = new GridLength(2, GridUnitType.Absolute) }); // Separator
grid.ColumnDefinitions.Add(cdTotal);
return grid;
}
static BoxView SeparatorV()
{
return new BoxView() { WidthRequest = 2, BackgroundColor = Color.Red };
}
static BoxView SeparatorH()
{
return new BoxView() { HeightRequest = 2, BackgroundColor = Color.Red };
}
class ListViewTemplateGrid : ViewCell
{
public ListViewTemplateGrid()
{
Label labelProduto = new Label() { VerticalOptions = LayoutOptions.Center };
labelProduto.SetBinding(Label.TextProperty, "Produto");
Label labelQtde = new Label() { VerticalOptions = LayoutOptions.Center, HorizontalOptions = LayoutOptions.Center };
labelQtde.SetBinding(Label.TextProperty, "Qtde");
Label labelUnitario = new Label() { VerticalOptions = LayoutOptions.Center, HorizontalOptions = LayoutOptions.Center };
labelUnitario.SetBinding(Label.TextProperty, "Unitario");
Label labelCusto = new Label() { VerticalOptions = LayoutOptions.Center };
labelCusto.SetBinding(Label.TextProperty, "Custo");
Label labelCustoDia = new Label() { VerticalOptions = LayoutOptions.Center, HorizontalOptions = LayoutOptions.Center };
labelCustoDia.SetBinding(Label.TextProperty, "Custo Diario");
Label labelUltVencto = new Label() { VerticalOptions = LayoutOptions.Center, HorizontalOptions = LayoutOptions.Center };
labelUltVencto.SetBinding(Label.TextProperty, "Ult. Vencto");
Label labelTotal = new Label() { VerticalOptions = LayoutOptions.Center, HorizontalOptions = LayoutOptions.Center };
labelTotal.SetBinding(Label.TextProperty, "UTotal");
// Add controls to the grid
Grid grid = CreateGrid();
grid.Children.Add(labelProduto, 0, 1, 0, 1);
grid.Children.Add(SeparatorV(), 1, 2, 0, 1);
grid.Children.Add(labelQtde, 2, 3, 0, 1);
grid.Children.Add(SeparatorV(), 3, 4, 0, 1);
grid.Children.Add(labelUnitario, 4, 5, 0, 1);
grid.Children.Add(SeparatorV(), 5, 6, 0, 1);
grid.Children.Add(labelCusto, 6, 7, 0, 1);
grid.Children.Add(SeparatorV(), 7, 8, 0, 1);
grid.Children.Add(labelCustoDia, 8, 9, 0, 1);
grid.Children.Add(SeparatorV(), 9, 10, 0, 1);
grid.Children.Add(labelUltVencto, 10, 11, 0, 1);
grid.Children.Add(SeparatorV(), 11, 12, 0, 1);
grid.Children.Add(labelTotal, 12, 13, 0, 1);
grid.Children.Add(SeparatorH(), 0, 5, 1, 2);
this.View = grid;
}
}
private async void btnVoltar_Clicked(object sender, EventArgs e)
{
await Navigation.PopModalAsync(true);
}
private async void btnOk_Clicked(object sender, EventArgs e)
{
//
}
}
This Attribute I don't put on my code
[XamlCompilation(XamlCompilationOptions.Compile)]
How can I solve this issue? I need to large my grid, so need to create a horizontal and vertical scroll.
