首页 文章

使用xamarin表单在移动应用程序上创建重叠加载程序

提问于
浏览
0

我正在使用Xamarin表单,并试图为我的屏幕创建一个重叠的加载器 . 根据我的发现,我需要使用绝对布局,我已经完成了 . 我已经完成了加载器在某些屏幕上工作,但是当屏幕稍微复杂时(使用嵌套的滚动视图,网格等),它似乎不起作用 . 下面是 DOES 工作的代码示例:

<AbsoluteLayout HorizontalOptions="FillAndExpand" VerticalOptions="FillAndExpand">
    <StackLayout Padding="10" Orientation="Vertical" AbsoluteLayout.LayoutFlags="All" AbsoluteLayout.LayoutBounds="0,0,1,1">
      <StackLayout Padding="0,85,0,0">
        <Image Source="myimage.png" HorizontalOptions="Center" VerticalOptions="Start" />
      </StackLayout>

      <StackLayout Orientation="Vertical" Padding="10, 5, 10, 5" HorizontalOptions="FillAndExpand" VerticalOptions="FillAndExpand">
        <Label Text="This works perfect"></Label>
      </StackLayout>
    </StackLayout>

    <!-- Loader -->
    <ContentView BackgroundColor="#222222"
                Opacity="0.3"
                AbsoluteLayout.LayoutFlags="All"
                AbsoluteLayout.LayoutBounds="0,0,1,1"
                IsVisible="{Binding IsIndicatorActive}">
      <ActivityIndicator AbsoluteLayout.LayoutFlags="All"
                         AbsoluteLayout.LayoutBounds="0,0,1,1"
                         VerticalOptions="{StaticResource LoaderPosition}"
                         HorizontalOptions="{StaticResource LoaderPosition}"
                         IsEnabled="{Binding IsIndicatorActive}"
                         IsRunning="{Binding IsIndicatorActive}"
                         IsVisible="{Binding IsIndicatorActive}" />
    </ContentView>
  </AbsoluteLayout>

以下代码是 DOESN'T 的工作原理:

<AbsoluteLayout HorizontalOptions="FillAndExpand" VerticalOptions="FillAndExpand">
    <StackLayout Orientation="Vertical" AbsoluteLayout.LayoutFlags="All" AbsoluteLayout.LayoutBounds="0,0,1,1">
      <ScrollView>
        <StackLayout Padding="0,85,0,0">
            <Image Source="myimage.png" HorizontalOptions="Center" VerticalOptions="Start" />
        </StackLayout>

        <StackLayout Orientation="Vertical" Padding="10, 5, 10, 5" HorizontalOptions="FillAndExpand" VerticalOptions="FillAndExpand">
            <Label Text="This doesn't work"></Label>
        </StackLayout>
      </ScrollView>

      <Grid HorizontalOptions="FillAndExpand" VerticalOptions="EndAndExpand" ColumnSpacing="0" RowSpacing="0">
        <Grid.RowDefinitions>
          <RowDefinition Height="Auto" />
        </Grid.RowDefinitions>

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

        <Button Grid.Row="0" Grid.Column="0" HorizontalOptions="FillAndExpand" Text="Button1" Command="{Binding Button2Command}" />
        <Button Grid.Row="0" Grid.Column="1" HorizontalOptions="FillAndExpand" Text="Button2" Command="{Binding Button2Command}" />
      </Grid>
    </StackLayout>

    <!-- Loader -->
    <ContentView BackgroundColor="#222222"
                Opacity="0.3"
                AbsoluteLayout.LayoutFlags="All"
                AbsoluteLayout.LayoutBounds="0,0,1,1"
                IsVisible="{Binding IsIndicatorActive}">
      <ActivityIndicator AbsoluteLayout.LayoutFlags="All"
                         AbsoluteLayout.LayoutBounds="0,0,1,1"
                         VerticalOptions="{StaticResource LoaderPosition}"
                         HorizontalOptions="{StaticResource LoaderPosition}"
                         IsEnabled="{Binding IsIndicatorActive}"
                         IsRunning="{Binding IsIndicatorActive}"
                         IsVisible="{Binding IsIndicatorActive}" />
    </ContentView>
  </AbsoluteLayout>

根据我的理解,它与scrollviews和gridview是 Managed Layouts 并且绝对布局是 Unmanaged Layouts 这一事实有关,所以我想如果我把一个stacklayout占用完整的绝对布局,然后滚动视图和gridview加入stacklayout它将相对于它parent(html处理这个的方式) . 很明显,这不是以这种方式处理的(相反,我只是得到一个空白的屏幕),这让我难以理解如何处理这个问题 .

我有什么想法可以解决这个问题并让我的装载机显示而不影响我的屏幕显示?谢谢!

1 回答

相关问题