代码之家  ›  专栏  ›  技术社区  ›  Swathy

如何开发xamarin表单中的响应页面

  •  -2
  • Swathy  · 技术社区  · 5 年前

    enter image description here

    XAML

    <RelativeLayout x:Name="outer_Layout" HorizontalOptions="FillAndExpand" 
                        VerticalOptions="FillAndExpand" 
                        BackgroundColor="#14C2F4" >
            <AbsoluteLayout  RelativeLayout.WidthConstraint="{ConstraintExpression
                    Type=RelativeToParent,Property=Width,Factor=1}"
                RelativeLayout.HeightConstraint="{ConstraintExpression
                    Type=RelativeToParent,Property=Height,Factor=1,Constant=50}"
                RelativeLayout.XConstraint="{ConstraintExpression
                    Type=RelativeToParent,Property=Width,Factor=0,Constant=0}"
                RelativeLayout.YConstraint="{ConstraintExpression
                    Type=RelativeToParent,Property=Height,Factor=0,Constant=0}"
                              BackgroundColor="#14C2F4">
                <Frame HorizontalOptions="FillAndExpand"
                   VerticalOptions="FillAndExpand" 
                   AbsoluteLayout.LayoutBounds="0,0,1,0.13"
                   BackgroundColor="#14C2F4"
                   HasShadow="True"                   
                   AbsoluteLayout.LayoutFlags="All">
                    <Image Source="hambuger" Aspect="AspectFill"
                           WidthRequest="30" HeightRequest="20"
                           HorizontalOptions="StartAndExpand" 
                           VerticalOptions="EndAndExpand"/>
                </Frame>
    
                <Frame x:Name="frm_Search"
                           AbsoluteLayout.LayoutBounds="0,0.15,1,0.1"
                           AbsoluteLayout.LayoutFlags="All"
                           HorizontalOptions="FillAndExpand" 
                           MinimumHeightRequest="30"
                           VerticalOptions="FillAndExpand"
                           Padding="10,0,10,0"  BorderColor="White"
                           BackgroundColor="#14C2F4" CornerRadius="0"
                           HasShadow="False" Margin="20,10,20,10">
                    <StackLayout HorizontalOptions="FillAndExpand" VerticalOptions="FillAndExpand" Orientation="Horizontal">
                        <Image Source="search_white" IsVisible="False"
                               HeightRequest="20" WidthRequest="20"
                              />
                        <local:CustomEntry x:Name="ent_Search" Placeholder="Search..." 
                                           TextColor="White"
                                           PlaceholderColor="White"
                                           FontSize="15"
                                           Text="David Ro"
                                           HorizontalOptions="FillAndExpand" 
                                           VerticalOptions="Center"                                          
                                           Margin="0,5,0,0"/>
                    </StackLayout>
                </Frame>
                <ListView x:Name="lv_Favorites" ItemsSource="{Binding _list}"  
                          VerticalOptions="FillAndExpand" SeparatorVisibility="None"
                          AbsoluteLayout.LayoutBounds="0,0.62,1,0.64"
                          AbsoluteLayout.LayoutFlags="All" BackgroundColor="#14C2F4" 
                          RowHeight="70"
                          Margin="0,0,0,10">
                    <ListView.ItemTemplate>
                        <DataTemplate>
                            <ViewCell>
                                <AbsoluteLayout HorizontalOptions="FillAndExpand" 
                                                BackgroundColor="Transparent"
                                                Margin="5"
                                                Padding="0">
    
    
                                    <StackLayout AbsoluteLayout.LayoutBounds="0.5,0,1,1" AbsoluteLayout.LayoutFlags="All" 
                                                     HorizontalOptions="FillAndExpand" BackgroundColor="White"
                                                     Orientation="Horizontal" Margin="25,2,5,2">
                                        <StackLayout HorizontalOptions="EndAndExpand" VerticalOptions="StartAndExpand" Margin="-10,5,10,0">
                                            <Label Text="{Binding Name}" HorizontalOptions="FillAndExpand" VerticalOptions="CenterAndExpand" />
                                            <Label Text="{Binding Location}" TextColor="Black" HorizontalOptions="FillAndExpand" VerticalOptions="EndAndExpand" />
                                        </StackLayout>
                                        <local:CustomButton 
                                                Text="FOLLOW"
                                                TextColor="White"
                                                HorizontalOptions="EndAndExpand"
                                                VerticalOptions="CenterAndExpand" 
                                                CustomBackgroundColor="#14C2F4"
                                                CustomBorderRadius="5"
                                                Padding="10,0,10,0"
                                                Margin="10,10,10,10"/>
                                    </StackLayout>
    
                                    <ci:CircleImage Source="{Binding ImageName}" Aspect="AspectFit"
                                                    AbsoluteLayout.LayoutBounds="0,0,0.3,1"
                                                    AbsoluteLayout.LayoutFlags="All"
                                                    HorizontalOptions="StartAndExpand"
                                                    BackgroundColor="Transparent"
                                                    Margin="-10,0,0,0"
                                                    VerticalOptions="CenterAndExpand"/>
                                </AbsoluteLayout>
                            </ViewCell>
                        </DataTemplate>
                    </ListView.ItemTemplate>
                </ListView>
            </AbsoluteLayout>
    
            <Grid ColumnSpacing="0" RowSpacing="0" HorizontalOptions="FillAndExpand"
                  RelativeLayout.YConstraint="{ConstraintExpression
                    Type=RelativeToParent,Property=Height,Factor=1,Constant=-55}"
                RelativeLayout.XConstraint="{ConstraintExpression
                    Type=RelativeToParent,Property=Width,Factor=0,Constant=0}"
                RelativeLayout.HeightConstraint="{ConstraintExpression
                    Type=RelativeToParent,Property=Width,Factor=0,Constant=60}"
                RelativeLayout.WidthConstraint="{ConstraintExpression
                    Type=RelativeToParent,Property=Width,Factor=1}">
    
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="*"/>
                    <ColumnDefinition Width="*"/>                    
                </Grid.ColumnDefinitions>
    
                <StackLayout x:Name="stack_Home" Spacing="0" Grid.Column="0" BackgroundColor="White">
                    <Image x:Name="img_home" HeightRequest="30" Source="home_gray"/>
                    <Label Text="Home" HorizontalOptions="Center"/>
                    <StackLayout.GestureRecognizers>
                        <TapGestureRecognizer Tapped="Home_Tapped"/>
                    </StackLayout.GestureRecognizers>
                </StackLayout>
    
                <StackLayout x:Name="stack_favorites" Spacing="0" Grid.Column="1" BackgroundColor="White">
                    <Image x:Name="img_favorites" HeightRequest="30" Source="logo"/>
                    <Label Text="Favorites" HorizontalOptions="Center"/>
                    <StackLayout.GestureRecognizers>
                        <TapGestureRecognizer Tapped="Favorites_Tapped"/>
                    </StackLayout.GestureRecognizers>
                </StackLayout>
            </Grid>
        </RelativeLayout>
    

    请帮帮我。。

    1 回复  |  直到 5 年前