Why does my listview take up more horizontal space than its children combined?

1. if you look at the images, the list item is the stuff with gray bg. in both horizontal and vertical, the listview's width takes up more width than all the children combined, which isn't what i expected.

2. The other things is that I want the full width to always be taken up on teh screen, so I don't know why the red part is showing (its the main bg color)

3. Why isn't there a padding above the "product 1 product 2" section?

Kudos to anyone helping!
TS

public App()
{
_vm = new ViewModel();

        var catalog = BuildCatalog ();
        var ticketItems = BuildTicketItems ();

        // The root page of your application
        var mainLayout = new StackLayout
        {
            BackgroundColor = Color.Red,
            Orientation = StackOrientation.Horizontal,
            HorizontalOptions = LayoutOptions.FillAndExpand,
            Children = {
                new StackLayout {
                    BackgroundColor = Color.Fuchsia,
                    Orientation = StackOrientation.Vertical,
                    HorizontalOptions = LayoutOptions.StartAndExpand,
                    Children = {
                        new Label
                        {
                            Text = "Austin",
                            BackgroundColor = _titleBackgroundColor,
                            FontAttributes = FontAttributes.Bold,
                            FontSize = 30,
                            TextColor = Color.Black,   // probably create types HeaderLabel, DetailLabel, PriceLabel, etc to have all styles set once unless it can be set like css with a single attribute (class)
                            HorizontalOptions = LayoutOptions.CenterAndExpand
                        },
                        new ScrollView()
                        {
                            BackgroundColor = Color.Green,
                            VerticalOptions = LayoutOptions.FillAndExpand,
                            Content = catalog,
                        }
                    }
                },
                new StackLayout {
                    BackgroundColor = Color.Fuchsia,
                    Orientation = StackOrientation.Vertical,
                    HorizontalOptions = LayoutOptions.End,
                    Children = {
                        new Label
                        {
                            Text = "Sales Ticket",
                            BackgroundColor = _titleBackgroundColor,
                            FontAttributes = FontAttributes.Bold,
                            FontSize = 30,
                            TextColor = Color.Black,
                            HorizontalOptions = LayoutOptions.Start/*AndExpand*/,
                        },
                        new Label
                        {
                            Text = "Tax Location",
                            BackgroundColor = _titleBackgroundColor,
                            FontAttributes = FontAttributes.Bold,
                            TextColor = Color.FromHex("ababab"),
                            HorizontalOptions = LayoutOptions.Start/*AndExpand*/,
                        },
                        ticketItems
                    }
                }
            }
        };

        MainPage = new ContentPage() { Content = mainLayout };
    }

private ListView BuildTicketItems(){
_vm.Model = new Ticket () {
TicketItems = new List(){
new TicketItem(){ itemName = "snickers", quantity = 1, amount = .88m },
new TicketItem(){ itemName = "Lollipop", quantity = 3, amount = 1.22m },
new TicketItem(){ itemName = "Baseball", quantity = 2, amount = 10.50m },
new TicketItem(){ itemName = "Glove", quantity = 7, amount = 15.99m },
new TicketItem(){ itemName = "Keyboard", quantity = 4, amount = 12.33m },
new TicketItem(){ itemName = "Mouse", quantity = 2, amount = 18.45m },
new TicketItem(){ itemName = "Monitor", quantity = 12, amount = 215.46m },
new TicketItem(){ itemName = "Shotgun", quantity = 10, amount = 465.89m },
}
};

        return new ListView () {
            BackgroundColor = Color.Aqua,
            ItemsSource = _vm.Model.TicketItems,
            ItemTemplate = new DataTemplate (() => {
                // Create views with bindings for displaying each property.
                Label nameLabel = new Label () { TextColor = Color.Black };
                nameLabel.SetBinding (Label.TextProperty, "itemName");  // do they need to match case?? make camel case if so

                Label quantityLabel = new Label () { TextColor = Color.Black };
                quantityLabel.SetBinding (Label.TextProperty, "quantity");

                Label amountLabel = new Label () { TextColor = Color.FromHex("4b9aee") };
                amountLabel.SetBinding (Label.TextProperty, new Binding("amount", BindingMode.Default, null, null, "{0:c}"));

            //this boxview not showing!
                BoxView boxView = new BoxView () { WidthRequest = 10, HeightRequest = 10, BackgroundColor = Color.Lime, };
                //boxView.SetBinding (BoxView.ColorProperty, "FavoriteColor");

                return new ViewCell {
                    View = new StackLayout {
                        Padding = new Thickness (0, 5),
                        Orientation = StackOrientation.Horizontal,
                        HorizontalOptions = LayoutOptions.End, 
                        BackgroundColor = Color.Silver,
                        Children = { boxView, quantityLabel, nameLabel, amountLabel, }
                    }
                };
            })
        };

}