Xamarin.Forms 용 피커 컨트롤을 만들었습니다.

iOS UIPickerView , Android NumberPicker 은 Xamarin.Forms 에서는 표준 컨트롤로 준비되어 있지 않은 것 같았기 때문에 Custom Renderer 로 만들었습니다.

특히 nuget 패키지라든가는 아니고, 샘플 앱과 함께 되어 있습니다 (><)

이런 느낌의 컨트롤입니다.

이런 느낌으로 사용할 수 있습니다.


ItemsSource 와 SelectedIndex 의 2 개의 바인더블인 프로퍼티 밖에 없고, SelectedIndex 는 TwoWay 입니다.

<?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:PickerViewSample"
             x:Class="PickerViewSample.PickerViewSamplePage"
             Title="PickerView Sample">

    <ContentPage.BindingContext>
        <local:Model />
    </ContentPage.BindingContext>

    <ContentPage.Resources>
        <ResourceDictionary>
            <local:ItemsSourceConverter x:Key="itemsConv"/>
        </ResourceDictionary>
    </ContentPage.Resources>

    <Grid>
        <Grid.RowDefinitions>
            <RowDefinition Height="Auto" />
            <RowDefinition Height="Auto" />
            <RowDefinition Height="Auto" />
        </Grid.RowDefinitions>

        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="Auto" />
            <ColumnDefinition Width="*" />
            <ColumnDefinition Width="Auto" />
        </Grid.ColumnDefinitions>

        <local:PickerView
            Grid.Row="0" Grid.Column="0" Grid.ColumnSpan="3"
            ItemsSource="{Binding ItemsSource, Converter={StaticResource itemsConv}}"
            SelectedIndex="{Binding SelectedIndex}" />

        <Label Grid.Row="1" Grid.Column="0" Text="ItemsSource" />
        <Entry Grid.Row="1" Grid.Column="1" Text="{Binding ItemsSource, Mode=TwoWay}" />

        <Label Grid.Row="2" Grid.Column="0" Text="SelectedIndex" />
        <Entry Grid.Row="2" Grid.Column="1" Text="{Binding SelectedIndex, Mode=TwoWay}" />
    </Grid>
</ContentPage>

소스 코드는

amay077/Xamarin_Forms_PickerViewSample

에 있으므로 Fork 등으로 사용하십시오.

iOS UIPickerView는 자체적으로 여러 열을 가질 수 있지만 Android는 그렇지 않으므로 한 열만 사용합니다.

Custom Renderer 샘플이 될 것입니다.

덧붙여 PickerView를 나란히 수치를 선택하는 UI도 만들었다

소스 코드는 위와 같은 기하브에 있습니다.