Question

我需要创建带有3个选项的垂直列表视图，但是如何？
像这样：

一个朋友帮我一点儿！但是如何在布局中添加“ CornerRadius”？ Video我需要用“框架”替换“标签”以添加“ CornerRadius”，对吗？我该如何更换

我的MainPage.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"
xmlns:local="clr-namespace:App11"
x:Class="App11.MainPage">

<StackLayout>
<ListView ItemsSource="{Binding MyModel}" HasUnevenRows="True">
    <ListView.ItemTemplate>
        <DataTemplate>
            <ViewCell>
                <Grid HorizontalOptions="FillAndExpand" BackgroundColor="#3e1519" HeightRequest="70">
                    <!--1st View-->
                    <StackLayout Orientation="Vertical" Grid.Column="0" Grid.Row="0" HeightRequest="40">
                            <Label Text="{Binding Title}" TextColor="White" />
                            <Label Text="{Binding SubTitle}"  TextColor="White" />
                        </StackLayout>
                    <StackLayout Orientation="Horizontal" Grid.Column="1" Grid.Row="0">
                            <Label Text="{Binding Dollar}"  TextColor="White" />
                            <Label Text="+" Margin="30,0,0,0" FontSize="Large"  TextColor="White">
                                <Label.GestureRecognizers>
                                    <TapGestureRecognizer Tapped="ShowSubView" />
                                </Label.GestureRecognizers>
                            </Label>
                        </StackLayout>
                        <!--SubView-->
                    <StackLayout BackgroundColor="#722f38" IsVisible="False" HeightRequest="30">
                            <Label Text="{Binding SubViewText}" TextColor="White" />
                        </StackLayout>
                    </Grid>
            </ViewCell>
        </DataTemplate>
    </ListView.ItemTemplate>
</ListView>

我的MainPage.xml.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()
     {
         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;
         }
      }
    }
 }

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"
            }
        };
     }
   }
}

Answer 1

添加零填充帧可以解决您的问题。框架的默认填充为20。

尝试下面给出的示例代码（未经测试）

<Frame CornerRadius="10" Padding="0">
    <StackLayout Orientation="Vertical" >
        <Frame CornerRadius="10" Padding="0">
            <StackLayout Orientation="Horizontal">
                <StackLayout Orientation="Vertical">
                    <Label Text="{Binding Title}" TextColor="White" />
                    <Label Text="{Binding SubTitle}"  TextColor="White" />
                </StackLayout>
                <Label Text="{Binding Dollar}"  TextColor="White" />
                <Label Text="+" Margin="30,0,0,0" FontSize="Large"  TextColor="White">
                    <Label.GestureRecognizers>
                        <TapGestureRecognizer Tapped="ShowSubView" />
                    </Label.GestureRecognizers>
                </Label>
            </StackLayout>
        </Frame>
        <StackLayout BackgroundColor="#722f38" IsVisible="False" HeightRequest="30">
            <Label Text="{Binding SubViewText}" TextColor="White" />
        </StackLayout>
    </StackLayout>
</Frame>

我需要创建一个垂直的列表视图。在Xamarin.Forms上

1 个答案: