如何在Xamarin表单中创建动态单选按钮组?

时间:2018-09-10 11:16:38

标签: c# xamarin xamarin.forms radio-button

如何根据以下动态问题创建UI?目前,我已经对问题和选项进行了硬编码。但是现在的要求是显示动态问题。选项将与1至5单选按钮相同。但是,根据Xamarin表单控件列表,没有像单选按钮组这样的控件。那我该如何实现呢?

目前,我的单个问题是这样添加的:

<StackLayout Margin="0,15">
                                        <Grid>
                                            <Grid.ColumnDefinitions>
                                                <ColumnDefinition Width="20*"/>
                                                <ColumnDefinition Width="12*"/>
                                                <ColumnDefinition Width="12*"/>
                                                <ColumnDefinition Width="12*"/>
                                                <ColumnDefinition Width="12*"/>
                                                <ColumnDefinition Width="12*"/>
                                                <ColumnDefinition Width="20*"/>
                                            </Grid.ColumnDefinitions>
                                            <Grid.RowDefinitions>
                                                <RowDefinition Height="30*"/>
                                                <RowDefinition Height="25"/>
                                                <RowDefinition Height="20"/>
                                            </Grid.RowDefinitions>

                                            <Label Grid.ColumnSpan="7" Grid.Column="0" Grid.Row="0" Text="How do you rate the quality of food on offer?" VerticalTextAlignment="Center" FontFamily="SF-UI-Text-Regular" FontSize="24"/>
                                            <Label Grid.Column="0" Grid.Row="2" Text="Bad" VerticalTextAlignment="Center" HorizontalTextAlignment="End" FontFamily="SF-UI-Text-Regular" FontSize="15"/>
                                            <Label Grid.Column="1" Grid.Row="1" Text="1" VerticalTextAlignment="Center" HorizontalTextAlignment="Center" FontFamily="SF-UI-Text-Regular" FontSize="15"/>
                                            <Label Grid.Column="2" Grid.Row="1" Text="2" VerticalTextAlignment="Center" HorizontalTextAlignment="Center" FontFamily="SF-UI-Text-Regular" FontSize="15"/>
                                            <Label Grid.Column="3" Grid.Row="1" Text="3" VerticalTextAlignment="Center" HorizontalTextAlignment="Center" FontFamily="SF-UI-Text-Regular" FontSize="15"/>
                                            <Label Grid.Column="4" Grid.Row="1" Text="4" VerticalTextAlignment="Center" HorizontalTextAlignment="Center" FontFamily="SF-UI-Text-Regular" FontSize="15"/>
                                            <Label Grid.Column="5" Grid.Row="1" Text="5" VerticalTextAlignment="Center" HorizontalTextAlignment="Center" FontFamily="SF-UI-Text-Regular" FontSize="15"/>
                                            <BoxView BackgroundColor="#FAFAFA" Grid.ColumnSpan="5" Grid.Column="1" Grid.Row="2"/>
                                            <Image Grid.Column="1" Grid.Row="2" x:Name="RbtnFoodQuality1" Source="radio_button.png" HeightRequest="10" WidthRequest="10">
                                                <Image.GestureRecognizers>
                                                    <TapGestureRecognizer Tapped="RbtnFoodQuality1Tapped" NumberOfTapsRequired="1"/>
                                                </Image.GestureRecognizers>
                                            </Image>
                                            <Image Grid.Column="2" Grid.Row="2" x:Name="RbtnFoodQuality2" Source="radio_button.png" HeightRequest="10" WidthRequest="10">
                                                <Image.GestureRecognizers>
                                                    <TapGestureRecognizer Tapped="RbtnFoodQuality2Tapped" NumberOfTapsRequired="1"/>
                                                </Image.GestureRecognizers>
                                            </Image>
                                            <Image Grid.Column="3" Grid.Row="2" x:Name="RbtnFoodQuality3" Source="radio_button.png" HeightRequest="10" WidthRequest="10">
                                                <Image.GestureRecognizers>
                                                    <TapGestureRecognizer Tapped="RbtnFoodQuality3Tapped" NumberOfTapsRequired="1"/>
                                                </Image.GestureRecognizers>
                                            </Image>
                                            <Image Grid.Column="4" Grid.Row="2" x:Name="RbtnFoodQuality4" Source="radio_button.png" HeightRequest="10" WidthRequest="10">
                                                <Image.GestureRecognizers>
                                                    <TapGestureRecognizer Tapped="RbtnFoodQuality4Tapped" NumberOfTapsRequired="1"/>
                                                </Image.GestureRecognizers>
                                            </Image>
                                            <Image Grid.Column="5" Grid.Row="2" x:Name="RbtnFoodQuality5" Source="radio_button.png" HeightRequest="10" WidthRequest="10">
                                                <Image.GestureRecognizers>
                                                    <TapGestureRecognizer Tapped="RbtnFoodQuality5Tapped" NumberOfTapsRequired="1"/>
                                                </Image.GestureRecognizers>
                                            </Image>
                                            <Label Grid.Column="6" Grid.Row="2" Text="Good" VerticalTextAlignment="Center" HorizontalTextAlignment="Start" FontFamily="SF-UI-Text-Regular" FontSize="15"/>
                                        </Grid>
                                    </StackLayout> 

现在,我必须动态处理每个控件的Tapped事件。如果我使用Viewcell并绑定它,这可能吗?

或者通过任何其他方式来实现这种功能和UI? Feedback

0 个答案:

没有答案