Quantcast
Channel: Xamarin.Forms — Xamarin Community Forums
Viewing all articles
Browse latest Browse all 77050

Vertical listview problem!

$
0
0

Hi, guys!. so... I need to create a vertical listview with 3 options like this image!.

A friend helped me a little bit!. but I do have some issue with 'SubViewText' when I use 'Frame' on 'SubViewText' he crashed the app... and when I remove 'Frame' he worked but. does not work as expected. Look at this recorded by me. https://youtube.com/watch?v=dMa7olPCQyM

My MainPage.xaml With 'Frame' crashing the app when I remove 'Frame' he worked

<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             xmlns:local="clr-namespace:App11"
             x:Class="App11.MainPage"
             BackgroundColor="White">

    <StackLayout>
        <ListView ItemsSource="{Binding MyModel}" HasUnevenRows="True" TranslationY="250">
            <ListView.ItemTemplate>
                <DataTemplate>
                    <ViewCell>
                        <Frame Margin="10,20,100,5" OutlineColor="#3E161A" HasShadow="true" HeightRequest="30" CornerRadius="10" TranslationX="40" BackgroundColor="#3E161A">
                            <Grid HorizontalOptions="FillAndExpand" BackgroundColor="#3E161A" Margin="-25,-5,-20,-10" TranslationY="-14" >
                            <!--1st View-->
                            <StackLayout>
                                <Label Text="{Binding Title}" TextColor="White" FontAttributes="Bold" TranslationX="20" TranslationY="15" />
                                    <Label Text="{Binding SubTitle}" TextColor="White" FontAttributes="Bold" FontSize="10" TranslationX="20" TranslationY="8" />
                            </StackLayout>
                            <StackLayout Orientation="Horizontal" Grid.Column="1" Grid.Row="0">
                                <Label Text="{Binding Dollar}" TextColor="White" FontSize="16" FontAttributes="Bold" TranslationY="20" TranslationX="5" />
                                <Label Text="▼" Margin="30,0,0,0" FontSize="Large" TextColor="White" TranslationY="15">
                                    <Label.GestureRecognizers>
                                        <TapGestureRecognizer Tapped="ShowSubView" />
                                    </Label.GestureRecognizers>
                                </Label>
                            </StackLayout>
                            <!--SubView-->
                                <Frame Margin="0,40,-160,-10" BorderColor="Gray" BackgroundColor="#722f38" CornerRadius="10" TranslationY="40">
                                    <StackLayout BackgroundColor="#722f38" IsVisible="False" HeightRequest="60">
                                        <Label Text="{Binding SubViewText}" TextColor="White" TranslationY="-5" FontSize="10" FontAttributes="Bold"/>
                                    </StackLayout>
                                </Frame>
                            </Grid>
                        </Frame>
                    </ViewCell>
                </DataTemplate>
            </ListView.ItemTemplate>
        </ListView>
    </StackLayout>

</ContentPage>

My MainPage.xaml.cs

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using Xamarin.Forms;

namespace App11
{
    public partial class MainPage : ContentPage
    {
        public MainPage()
        {
            // Initialize Live Reload.
            #if DEBUG
            LiveReload.Init();
            #endif
            InitializeComponent();
            this.BindingContext = new MainPageViewModel();
        }

        private void ShowSubView(object sender, EventArgs e)
        {
            var item1 = ((Label)sender);
            var FirstView = ((Grid)((StackLayout)item1.Parent).Parent);
            var item2 = ((StackLayout)FirstView.Children[2]);
            if (item2.IsVisible)
            {
                Grid.SetRow(item2, 0);
                item2.IsVisible = false;
            }
            else
            {
                Grid.SetRow(item2, 1);
                item2.IsVisible = true;
            }
        }
    }
}

My MainPageModel.cs

using System;
using System.Collections.Generic;
using System.ComponentModel;
using System.Text;

 namespace App11
 {
     public class MainPageModel : INotifyPropertyChanged
     {
         public event PropertyChangedEventHandler PropertyChanged;
         public void OnPropertyChanged(string name)
         {
             if (this.PropertyChanged != null)
                 this.PropertyChanged(this, new PropertyChangedEventArgs(name));
         }
         private string title;
         public string Title
         {
             get { return title; }
             set
             {
                 title = value;
                 OnPropertyChanged("Title");
             }
         }
         private string subTitle;
         public string SubTitle
         {
             get { return subTitle; }
            set
            {
                subTitle = value;
                OnPropertyChanged("SubTitle");
            }
        }
        private string dollar;
        public string Dollar
        {
            get { return dollar; }
            set
            {
                dollar = value;
                OnPropertyChanged("Dollar");
            }
        }
        private string subViewText;
        public string SubViewText
        {
            get { return subViewText; }
            set {
                subViewText = value;
                OnPropertyChanged("subViewText");
            }
        }
    }
}

My MainPageViewModel.cs

using System;
using System.Collections.Generic;
using System.Collections.ObjectModel;
using System.ComponentModel;
using System.Text;

namespace App11
{
    public class MainPageViewModel : INotifyPropertyChanged
    {
        public event PropertyChangedEventHandler PropertyChanged;
        public void OnPropertyChanged(string name)
        {
            if (this.PropertyChanged != null)
                this.PropertyChanged(this, new PropertyChangedEventArgs(name));
        }
        private ObservableCollection<MainPageModel> myModel;
        public ObservableCollection<MainPageModel> MyModel
        {
            get { return myModel; }
            set
            {
                myModel = value;
                OnPropertyChanged("MyModel");
                }
        }
        public MainPageViewModel()
        {
            MyModel = new ObservableCollection<MainPageModel>()
            {
                new MainPageModel()
                {
                    Title = "MENSAL",
                    SubTitle = "cobranças a cada 30 dias",
                    Dollar = "R$ 22,90",
                    SubViewText = "Acesso a 10 campanhas por mês Até 3 campanhas por mês Visualização de perfil limitada"
                },
                new MainPageModel()
                {
                    Title = "TRIMESTRAL",
                    SubTitle = "cobranças a cada 90 dias",
                    Dollar = "R$ 49,90",
                    SubViewText = "Acesso a rola do kid bengala quase ilimitada"
                },
                new MainPageModel()
                {
                    Title = "SEMESTRAL",
                    SubTitle = "cobranças a cada 180 dias",
                    Dollar = "R$ 99,90",
                    SubViewText = "Acesso a rola do kid bengala ilimitada"
                }
            };
        }
    }
}

Viewing all articles
Browse latest Browse all 77050

Trending Articles