【发布时间】:2018-08-09 14:27:50
【问题描述】:
我需要创建一个带有 3 个选项的垂直列表视图,但是如何?
像这样:
朋友帮帮我吧!但是如何在布局中添加“CornerRadius”? Video 我需要将 'Label' 替换为 'Frame' 以添加 '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");
}
}
}
}
我的 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"
}
};
}
}
}
【问题讨论】:
-
好吧,框架就像一个 ViewContainer 一样,只需在其中添加一些东西,就像在堆栈布局中添加一样,就可以了
-
你可以参考这个:docs.microsoft.com/en-us/dotnet/api/…,通过使用框架,它会为你提供像这样的角半径属性:
<Frame CornerRadius="10">....</Frame>。将你所有的内容放在Frame中。
标签: xamarin xamarin.forms xamarin.android