CODEWITHSUNDEEP
c#androidxamlxamarinxamarin.forms
Kate Hawke
Kate Hawke

Reputation: 1

Xamarin.Forms how to bind pages to items in ObservableCollection

I am new in xamarin.forms. Please help me, how i can bind new pages to this menu?

            <Grid x:Name="MenuItemsView" Grid.Column="1" HorizontalOptions="FillAndExpand" TranslationX="-50" Opacity="0">
                <StackLayout Margin="0,70,0,0" Spacing="20" BindableLayout.ItemsSource="{Binding MenuItems}">
                    <BindableLayout.ItemTemplate>
                        <DataTemplate>
                            <StackLayout Orientation="Horizontal" Spacing="20">
                                <StackLayout.GestureRecognizers>
                                    <TapGestureRecognizer Tapped="MenuTapped"/>
                                </StackLayout.GestureRecognizers>
                                <Image Source="{Binding Icon}" WidthRequest="20" HeightRequest="20" 
                                    VerticalOptions="Center" HorizontalOptions="Start"/>
                                <Label Text="{Binding Title}" TextColor="White" FontSize="22" FontAttributes="Bold" 
                                    HorizontalOptions="Start" VerticalOptions="Center"/>
                            </StackLayout>
                        </DataTemplate>
                    </BindableLayout.ItemTemplate>
                </StackLayout>
            </Grid>

        public ObservableCollection<Menu> MenuItems { get; set; }
        private ObservableCollection<Menu> GetMenus()
        {
            return new ObservableCollection<Menu>
            {
                new Menu { Title = "PROFILE", Icon = "profile.png" },
                new Menu { Title = "FEED", Icon = "feed.png" },
                new Menu { Title = "SETTINGS", Icon = "settings.png" }
            };
        }

I really cannot understand what to do :(

Upvotes: 0

Views: 51

Answers (1)

Jason
Jason

Reputation: 89082

you have not assigned any value to MenuItems

try this

public ObservableCollection<Menu> MenuItems { get; set; } = new ObservableCollection<Menu>
        {
            new Menu { Title = "PROFILE", Icon = "profile.png" },
            new Menu { Title = "FEED", Icon = "feed.png" },
            new Menu { Title = "SETTINGS", Icon = "settings.png" }
        };
    }

Upvotes: 2

Related Questions