Xamarin Forms ScrollView显示空白屏幕

时间:2018-04-09 08:27:44

标签: xaml xamarin.forms scrollview

以下XAML显示我的页面很好,直到我添加了ScrollView,现在它只显示一个空白屏幕。

有人能发现任何明显的东西吗?我怀疑是因为我在ScrollView中设置了网格的高度,但我不确定

<ContentPage.Content>
        <ScrollView>
            <Grid BackgroundColor="#ede8db" x:Name="articleGrid" >
                <Grid.RowDefinitions>
                    <RowDefinition Height="47.5*" />
                    <RowDefinition Height="5*" />
                    <RowDefinition Height="47.5*" />
            </Grid.RowDefinitions>
                <ratio:ContentRatioContainer Grid.Row="0" x:Name="imgContainer">
                    <Image Aspect="AspectFill" Source="KevingroveCarouselImg.png" AbsoluteLayout.LayoutBounds="1,1,1,1" AbsoluteLayout.LayoutFlags="All" x:Name="bigImg" 

                            HeightRequest="{artina:OnOrientationDouble PortraitPhone=880, LandscapePhone=125, PortraitTablet=600, LandscapeTablet=400 }" Grid.Row="0"/>
                </ratio:ContentRatioContainer>
                <artina:Button Margin="10,10,10,10" x:Name="ImgZoom" Clicked="EnlargeImage" HorizontalOptions="End" VerticalOptions="Start" Image="IncreaseImageIcon.png" BackgroundColor="Transparent"  HeightRequest="30" WidthRequest="30"/>

                <StackLayout Grid.Row="1" Orientation="Horizontal" BackgroundColor="#ede8db" Margin="0" Padding="30,0,30,0" x:Name="iconStack" HorizontalOptions="FillAndExpand" >
                    <Label HorizontalTextAlignment="Center" Text="{x:Static ratio:FontAwesome.WIFI}" Style="{StaticResource FontIcon}" TextColor="Black" FontSize="{artina:OnOrientationDouble PortraitPhone=25, LandscapePhone=18, PortraitTablet=30, LandscapeTablet=20 }" />
                    <Label HorizontalTextAlignment="Center" Text="{x:Static ratio:FontAwesome.CAMERA}" Style="{StaticResource FontIcon}" TextColor="Black" FontSize="{artina:OnOrientationDouble PortraitPhone=25, LandscapePhone=18, PortraitTablet=30, LandscapeTablet=20 }" />
                    <Label HorizontalTextAlignment="Center" Text="{x:Static ratio:FontAwesome.MAP}" Style="{StaticResource FontIcon}" TextColor="Black" FontSize="{artina:OnOrientationDouble PortraitPhone=25, LandscapePhone=18, PortraitTablet=30, LandscapeTablet=20 }" />
                   <Label x:Name="expand" HorizontalTextAlignment="Center" HorizontalOptions="EndAndExpand" Text="{x:Static ratio:FontAwesome.ARROW_DOWN}" Style="{StaticResource FontIcon}" TextColor="Black" FontSize="{artina:OnOrientationDouble PortraitPhone=25, LandscapePhone=18, PortraitTablet=30, LandscapeTablet=20 }" />
                </StackLayout>

                <StackLayout Grid.Row="2" x:Name="articleInfo" Padding="30,0,30,0" >
                    <StackLayout x:Name="TopLayout" Opacity="0.0">
                        <StackLayout Orientation="Horizontal">
                            <Label HorizontalTextAlignment="Center" Text="{x:Static ratio:FontAwesome.MAP_MARKER}" Style="{StaticResource FontIcon}" TextColor="Black" FontSize="30" />
                            <Label Text="Address" VerticalOptions="Center" HorizontalOptions="StartAndExpand"  />
                        </StackLayout>

                        <StackLayout Orientation="Horizontal">
                            <Label HorizontalTextAlignment="Center" Text="{x:Static ratio:FontAwesome.CLOCK_O}" Style="{StaticResource FontIcon}" TextColor="Black" FontSize="30" />
                            <Label Text="Openening Times" VerticalOptions="Center" HorizontalOptions="StartAndExpand"  />
                        </StackLayout>

                    <StackLayout x:Name="EmptySpaceStack" HeightRequest="80" />

                    <StackLayout x:Name="txt" >
                        <Label x:Name="header" Text="HEADER" Style="{ StaticResource HeaderStyle }" />
                        <Label x:Name="description" Text="TEST" FontSize="Large" />
                        <Label x:Name="articleTxt" Text="BLAH..." FontSize="Medium"/>
                    </StackLayout>

                </StackLayout>

            </StackLayout>

            </Grid>
        </ScrollView>
    </ContentPage.Content>

更新

看起来像导致问题的ContentRationContainer,只是想弄清楚为什么......

public class ContentRatioContainer : ContentView
    {
        public double ratio;

        protected override SizeRequest OnMeasure(double widthConstraint, double heightConstraint)
        {
            var width = Application.Current.MainPage.Width;
            var height = Application.Current.MainPage.Height;

            if (Device.Idiom == TargetIdiom.Phone)
            {
                ratio = Convert.ToDouble(Resx.AppResources.ImageRatioContentPhone);
            }
            if (Device.Idiom == TargetIdiom.Tablet)
            {
                if (width > height)
                {
                    ratio = Convert.ToDouble(Resx.AppResources.ImageRatioContentTabL);
                }
                else
                {
                    ratio = Convert.ToDouble(Resx.AppResources.ImageRatioContentTabP);
                }
            }

            return new SizeRequest(new Size(widthConstraint, widthConstraint * ratio));
        }

        public static BindableProperty ContentRatioProperty = BindableProperty.Create(nameof(ContentRatio), typeof(double), typeof(ContentRatioContainer), (double)1);

        public double ContentRatio
        {
            get { return (double)this.GetValue(ContentRatioProperty); }
            set { this.SetValue(ContentRatioProperty, value); }
        }
    }

0 个答案:

没有答案
相关问题