Xamarin表单创建表
我需要使用xamarin表单中的列表视图创建一个表。我能够创建包含五列的列表视图。但我不能给出列和行的标题。如果有人知道如何创建带有标题的表结构,请帮助我。提前谢谢 这是我的表[标题和列表视图]的源代码Xamarin表单创建表,xamarin,xamarin.forms,Xamarin,Xamarin.forms,我需要使用xamarin表单中的列表视图创建一个表。我能够创建包含五列的列表视图。但我不能给出列和行的标题。如果有人知道如何创建带有标题的表结构,请帮助我。提前谢谢 这是我的表[标题和列表视图]的源代码 <Grid> <Grid.RowDefinitions> <RowDefinition Height="20"></RowDefinition> <RowDefinition Height="A
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="20"></RowDefinition>
<RowDefinition Height="Auto"></RowDefinition>
</Grid.RowDefinitions>
<StackLayout Grid.Row="0" Padding="40,10,10,40" Spacing="0">
<BoxView HeightRequest="1" BackgroundColor="Black"></BoxView>
<StackLayout Orientation="Horizontal" Spacing="40">
<BoxView WidthRequest="1" HeightRequest="10" BackgroundColor="Black" HorizontalOptions="Start" VerticalOptions="Fill" />
<StackLayout Orientation="Horizontal" Spacing="1" HorizontalOptions="StartAndExpand">
<controls:CheckBox></controls:CheckBox>
<Label Text="Select All" FontAttributes="Bold" HorizontalOptions="Center" VerticalOptions="Center"></Label>
</StackLayout>
<BoxView WidthRequest="1" HeightRequest="10" BackgroundColor="Black" HorizontalOptions="Start" VerticalOptions="Fill" />
<StackLayout Orientation="Horizontal" Spacing="1" HorizontalOptions="StartAndExpand">
<Label Text="Last Name, First Name" HorizontalOptions="Center" VerticalOptions="Center" FontAttributes="Bold"></Label>
<Button Text=">" HeightRequest="5" WidthRequest="5"></Button>
</StackLayout>
<BoxView WidthRequest="1" HeightRequest="10" BackgroundColor="Black" HorizontalOptions="Start" VerticalOptions="Fill" />
<Label Text="Child ID" HorizontalOptions="StartAndExpand" VerticalOptions="Center" FontAttributes="Bold"></Label>
<BoxView WidthRequest="1" HeightRequest="10" BackgroundColor="Black" HorizontalOptions="Start" VerticalOptions="Fill" />
<Label Text="Date of Birth" HorizontalOptions="StartAndExpand" VerticalOptions="Center" FontAttributes="Bold"></Label>
<BoxView WidthRequest="1" HeightRequest="10" BackgroundColor="Black" HorizontalOptions="Start" VerticalOptions="Fill" />
<Label Text="Location" HorizontalOptions="StartAndExpand" VerticalOptions="Center" FontAttributes="Bold"></Label>
<BoxView WidthRequest="1" HeightRequest="10" BackgroundColor="Black" HorizontalOptions="Start" VerticalOptions="Fill" />
<Label Text="Enrollment" HorizontalOptions="StartAndExpand" VerticalOptions="Center" FontAttributes="Bold"></Label>
<BoxView WidthRequest="1" HeightRequest="10" BackgroundColor="Black" HorizontalOptions="Start" VerticalOptions="Fill" />
<Label Text="Actions" HorizontalOptions="StartAndExpand" VerticalOptions="Center" FontAttributes="Bold"></Label>
<BoxView WidthRequest="1" HeightRequest="10" BackgroundColor="Black" HorizontalOptions="Start" VerticalOptions="Fill" />
</StackLayout>
<BoxView HeightRequest="1" BackgroundColor="Black"></BoxView>
</StackLayout>
<StackLayout Padding="40,10,10,40" HeightRequest="200" Grid.Row="1" Spacing="0">
<ListView ItemsSource="{Binding ChildRecords}" HasUnevenRows="True">
<ListView.ItemTemplate>
<DataTemplate>
<ViewCell>
<ViewCell.View>
<StackLayout>
<!-- <BoxView HeightRequest="1" BackgroundColor="Black"></BoxView>-->
<StackLayout Orientation="Horizontal">
<BoxView WidthRequest="1" HeightRequest="15" BackgroundColor="Black" HorizontalOptions="Start" />
<StackLayout Orientation="Horizontal" Spacing="1" HorizontalOptions="StartAndExpand">
<Label Text="Select All" FontAttributes="Bold" HorizontalOptions="Center" VerticalOptions="Center"></Label>
</StackLayout>
<BoxView WidthRequest="1" HeightRequest="15" BackgroundColor="Black" HorizontalOptions="Start" />
<StackLayout Orientation="Horizontal" Spacing="1" HorizontalOptions="StartAndExpand">
<Label Text="Last Name, First Name" HorizontalOptions="Center" VerticalOptions="Center" FontAttributes="Bold"></Label>
<Button Text=">" HeightRequest="5" WidthRequest="5"></Button>
</StackLayout>
<BoxView WidthRequest="1" BackgroundColor="Black" HorizontalOptions="Start" HeightRequest="15" />
<Label Text="Child ID" HorizontalOptions="StartAndExpand" VerticalOptions="Center" FontAttributes="Bold"></Label>
<BoxView WidthRequest="1" BackgroundColor="Black" HorizontalOptions="Start" HeightRequest="15" />
<Label Text="Date of Birth" HorizontalOptions="StartAndExpand" VerticalOptions="Center" FontAttributes="Bold"></Label>
<BoxView WidthRequest="1" BackgroundColor="Black" HorizontalOptions="Start" HeightRequest="15" />
<Label Text="Location" HorizontalOptions="StartAndExpand" VerticalOptions="Center" FontAttributes="Bold"></Label>
<BoxView WidthRequest="1" BackgroundColor="Black" HorizontalOptions="Start" HeightRequest="15" />
<Label Text="Enrollment" HorizontalOptions="StartAndExpand" VerticalOptions="Center" FontAttributes="Bold"></Label>
<BoxView WidthRequest="1" BackgroundColor="Black" HorizontalOptions="Start" HeightRequest="15" />
<Label Text="Actions" HorizontalOptions="StartAndExpand" VerticalOptions="Center" FontAttributes="Bold"></Label>
<BoxView WidthRequest="1" BackgroundColor="Black" HorizontalOptions="Start" HeightRequest="15"/>
</StackLayout>
<BoxView HeightRequest="1" BackgroundColor="Black"></BoxView>
</StackLayout>
</ViewCell.View>
</ViewCell>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
</StackLayout>
</Grid>
为此,您可以使用网格将网格的第一行作为标题,您可以轻松地仅更改标题上的样式。下面是创建3行2列的示例
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="*" />
<RowDefinition Height="*" />
<RowDefinition Height="*" />
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*" />
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
</Grid>
如果您想要快速/专业的外观,可以尝试Xamarin的Synfaction自定义控件。如果您的公司收入低于100万,它们可以免费使用。通常我喜欢做的是在ListView上方为标题创建一个网格,然后在ListView中创建包含相同列宽网格的ViewCell
例如:
<Grid HorizontalOptions="FillAndExpand" VerticalOptions="Start" RowSpacing="0">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*" />
<ColumnDefinition Width="*" />
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="20" />
</Grid.RowDefinitions>
<Label Grid.Column="0" Text="Heading 1" />
<Label Grid.Column="1" Text="Heading 2" />
<Label Grid.Column="2" Text="Heading 3" />
</Grid>
<ListView ItemsSource="{}" HasUnevenRows="true" HeightRequest="200" SeparatorVisibility="None">
<ListView.ItemTemplate>
<DataTemplate>
<ViewCell>
<ViewCell.View>
<Grid Margin="0" Padding="0" RowSpacing="0">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*" />
<ColumnDefinition Width="*" />
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
<Label Grid.Column="0" Margin="0" Text="{Binding data1}" />
<Label Grid.Column="1" Margin="0" Text="{Binding data2}" />
<Label Grid.Column="2" Margin="0" Text="{Binding data3}" />
</Grid>
</ViewCell.View>
</ViewCell>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
请注意,ListView还附带了一个标题,如果希望标题与ListView中的项目一起滚动,则该标题非常有用。请查看此文档:
这就是我所做的,下面的图片就是它的结果。。抱歉,无法显示我的代码。欢迎使用StackOverflow!有几种方法可以做到这一点,最好的解决方案是建立在你已经拥有的基础上。你能和我们分享一下你桌子上的代码吗?如果你还可以添加一些截图来更好地了解你拥有的以及你想要得到的东西,我编辑了我的文章以了解我想要做的事情。标题列和Listview列宽不匹配。我使用的是boxview,但它也没有像预期的那样工作。如果你能提供一个解决方案,那就太好了。感谢您添加名称空间信息。我不确定程序集“控件”来自何处。整个页面的代码将更有帮助。感谢您的回复。我刚刚用我想做的源代码编辑了我的文章。若您知道解决方案,请告诉@Tulasi,若要与标题匹配,也必须在listview中使用网格。使用网格也可以创建列。使用网格并将标签放置在该网格内
<ContentPage.Content>
<ScrollView VerticalOptions="Fill" HorizontalOptions="Fill">
<Grid HorizontalOptions="FillAndExpand" VerticalOptions="StartAndExpand" RowSpacing="0" >
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*" />
<ColumnDefinition Width="*" />
<ColumnDefinition Width="*" />
<ColumnDefinition Width="*" />
<ColumnDefinition Width="*" />
<ColumnDefinition Width="*" />
<ColumnDefinition Width="*" />
<ColumnDefinition Width="*" />
<ColumnDefinition Width="*" />
<ColumnDefinition Width="*" />
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="20" />
<RowDefinition Height="*" />
</Grid.RowDefinitions>
<Label Grid.Column="0" Text="Entry Name" BackgroundColor="LightGreen" TextColor="Black" FontAttributes="Bold"/>
<Label Grid.Column="1" Text="Entry Date" BackgroundColor="LightGreen" TextColor="Black" FontAttributes="Bold" />
<Label Grid.Column="2" Text="Enty Type" BackgroundColor="LightGreen" TextColor="Black" FontAttributes="Bold" />
<Label Grid.Column="3" Text="Transaction Type" BackgroundColor="LightGreen" TextColor="Black" FontAttributes="Bold"/>
<Label Grid.Column="4" Text="Cashflow " BackgroundColor="LightGreen" TextColor="Black" FontAttributes="Bold" />
<Label Grid.Column="5" Text="Particular" BackgroundColor="LightGreen" TextColor="Black" FontAttributes="Bold" />
<Label Grid.Column="6" Text="VoucherNumber" BackgroundColor="LightGreen" TextColor="Black" FontAttributes="Bold" />
<Label Grid.Column="7" Text="LedgerFolio" BackgroundColor="LightGreen" TextColor="Black" FontAttributes="Bold" />
<Label Grid.Column="8" Text="Amount" BackgroundColor="LightGreen" TextColor="Black" FontAttributes="Bold" />
<Label Grid.Column="9" Text="PurchaseInvoice" BackgroundColor="LightGreen" TextColor="Black" FontAttributes="Bold" />
<Label Grid.Column="10" Text="Credit Or Debit" BackgroundColor="LightGreen" TextColor="Black" FontAttributes="Bold"/>
<ListView x:Name="ContentListview" HasUnevenRows="true" HeightRequest="200" SeparatorVisibility="None" Grid.Row="1" Grid.Column="0" Grid.ColumnSpan="11" HorizontalScrollBarVisibility="Default" VerticalScrollBarVisibility="Default">
<ListView.ItemTemplate>
<DataTemplate>
<ViewCell>
<ViewCell.View>
<Grid Margin="0" Padding="0" RowSpacing="0">
<Label Grid.Column="0" Text="{Binding EntryName}" TextColor="Black" />
<Label Grid.Column="1" Text="{Binding EntryDate}" TextColor="Black" />
<Label Grid.Column="2" Text="{Binding EntyType}" TextColor="Black" />
<Label Grid.Column="3" Text="{Binding TransactionType}" TextColor="Black" />
<Label Grid.Column="4" Text="{Binding Cashflow}" TextColor="Black" />
<Label Grid.Column="5" Text="{Binding Particular}" TextColor="Black" />
<Label Grid.Column="6" Text="{Binding VoucherNumber}" TextColor="Black" />
<Label Grid.Column="7" Text="{Binding LedgerFolio}" TextColor="Black" />
<Label Grid.Column="8" Text="{Binding Amount}" TextColor="Black" />
<Label Grid.Column="9" Text="{Binding PurchaseInvoice}" TextColor="Black" />
<Label Grid.Column="10" Text="{Binding CreditOrDebit}" TextColor="Black" />
</Grid>
</ViewCell.View>
</ViewCell>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
</Grid>
</ScrollView>
</ContentPage.Content>