是否有可能在xamarin中创建带有android和ios视图的sdk /库?

时间:2017-09-23 07:24:12

标签: xamarin sdk xamarin.ios xamarin.forms xamarin.android

我们可以在xamarin中为android和IOS创建sdk或库吗?而库或sdk也应该包含一些UI(视图)。库或sdk是否可以包含我们可以与xamarin的其他项目一起使用的视图?

1 个答案:

答案 0 :(得分:0)

是的!您可以在Xamarin.Forms中使用Bindable Properties自定义控件,然后将其打包到nuget包中。

例如:您可以在另一个名为 MyCustomControl 的文件夹中创建ContentView

<?xml version="1.0" encoding="UTF-8"?>
<ContentView xmlns="http://xamarin.com/schemas/2014/forms" 
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             x:Class="BindablePropertyDemo.Custom.MyCustomControl">
    <Grid x:Name="grid" 
          Padding="10,40,10,10"
          HeightRequest="160"
          VerticalOptions="Start">
        <Grid.RowDefinitions>
            <RowDefinition Height="100"/>
            <RowDefinition Height="Auto"/>
        </Grid.RowDefinitions>
        <Image x:Name="image"
               HeightRequest="100" 
               HorizontalOptions="Center"/>

        <Label x:Name="title"
               Text="BASKETBALL"
               Grid.Row="1" 
               FontSize="20"
               VerticalOptions="Center"
               TextColor="White"
               HorizontalOptions="Center" 
               FontAttributes="Bold"/>
    </Grid>
</ContentView>

然后你可以从任何这样的页面调用这个控件:

<?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:BindablePropertyDemo"
             xmlns:custom="clr-namespace:BindablePropertyDemo.Custom"
             x:Class="BindablePropertyDemo.MainPage"
             BackgroundColor="#33334c">
    <ScrollView>
        <Grid RowSpacing="0">
            <Grid.RowDefinitions>
                <RowDefinition Height="60"/>
                <RowDefinition Height="Auto"/>
            </Grid.RowDefinitions>
            <Grid BackgroundColor="White">
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="60"/>
                    <ColumnDefinition Width="*"/>
                </Grid.ColumnDefinitions>
                <Grid BackgroundColor="#ff4284" Padding="10">
                    <Image Source="hamburger.png"/>
                </Grid>
                <Label Grid.Column="1" 
                   Text="Home" 
                   TextColor="#ff4284" 
                   FontSize="20"
                   Margin="5,0,0,0" 
                   HorizontalOptions="Start" 
                   VerticalOptions="Center"/>
            </Grid>
            <StackLayout Spacing="0" Grid.Row="1"><
                <!-- SEE HERE!! -->
                <custom:MyCustomControl BackgroundColor="#76dab2" 
                                    TitleText="BASKETBALL" 
                                    Image="basketball.png"/>

                <custom:MyCustomControl BackgroundColor="#7c57e4" 
                                    TitleText="FOOTBALL" 
                                    Image="football.png"/>

                <custom:MyCustomControl BackgroundColor="#f1b136" 
                                    TitleText="GRIDIRON" 
                                    Image="gridiron.png"/>
            </StackLayout>
        </Grid>
    </ScrollView>
</ContentPage>

你会得到这样的结果:

enter image description here

我已经采用了这个tutorial的例子,你可以继续获得更多信息。

您可以在此处找到他们的源代码:https://github.com/mindofai/BindablePropertyDemo