长时间动作之间的Xamrian表单加载屏幕活动指示器

时间:2019-05-04 22:43:44

标签: xamarin.forms xamarin.android

我正在使用活动指示器,但它只应在单击按钮时显示,这是可以的,但令人高兴的是,它收敛了我的整个表单,而根本不显示进度。

<ContentPage.Content>
    <StackLayout Orientation="Vertical" Padding="30" Spacing="40">
        <BoxView HeightRequest="10"/>
        <Label Text="Delivery Go" TextColor="WhiteSmoke" FontSize="Large" FontAttributes="Bold"></Label>
        <Image HorizontalOptions="Center" WidthRequest="300" Source="maco.jpg"/>
        <Frame BackgroundColor="#BF043055" HasShadow="False">


            <StackLayout Orientation="Vertical" Spacing="10">
                <Label x:Name="lblError" TextColor="Red"></Label>
                <Entry x:Name="txtUserName" Text="{Binding Email}" Placeholder="Email"   
                       PlaceholderColor="White" HeightRequest="40"   
                       Keyboard="Email"  
                       TextColor="White"/>
                <Entry x:Name="txtPassword" Text="{Binding Password}" Placeholder="Password"   
                       PlaceholderColor="White" HeightRequest="40"   
                       IsPassword="True"  
                       TextColor="White"/>
            </StackLayout>
        </Frame>
        <Button Command="{Binding SubmitCommand}" Clicked="BtnLogin_Clicked" Text="Login" TextColor="White"  
                FontAttributes="Bold" FontSize="Large" HorizontalOptions="FillAndExpand"  
                BackgroundColor="#088da5" />
    </StackLayout>


</ContentPage.Content>
<StackLayout HeightRequest="40" VerticalOptions="End">
    <ActivityIndicator IsRunning="{Binding Busy}"
                     IsVisible="{Binding Busy}"
                      HeightRequest="40"
                      VerticalOptions="CenterAndExpand"
                      HorizontalOptions="CenterAndExpand">
        <ActivityIndicator.WidthRequest>
            <OnPlatform x:TypeArguments="x:Double" iOS="100" Android="100" WinPhone="400" />
        </ActivityIndicator.WidthRequest>
        <ActivityIndicator.Color>
            <OnPlatform x:TypeArguments="Color"
                  iOS="#2499CE" WinPhone="#2499CE" />
        </ActivityIndicator.Color>
    </ActivityIndicator>
</StackLayout>

如您所见,我在页面级别使用IsBusy进行设置,但是问题是它覆盖了我的整个屏幕,并且没有显示任何动画,因此您提供自己的图形还是应该不显示一个动画?给你的?。

enter image description here

第二张图片显示的是表单的外观,没有活动指示器代码。

请问我的代码有什么问题。

enter image description here

1 个答案:

答案 0 :(得分:2)

原因:

请勿将您的Activity Indicator放在ContentPage.Content之外,它会重叠您的视图。那就是你看不到任何东西的原因。

解决方案:

Activity Indicator放在ContentPage.Content内,您可以将其放置在所需的任何位置,例如:

<ContentPage.Content>
    <StackLayout Orientation="Vertical" Padding="30" Spacing="40">
        <BoxView HeightRequest="10"/>
        <Label Text="Delivery Go" TextColor="WhiteSmoke" FontSize="Large" FontAttributes="Bold"></Label>
        <Image HorizontalOptions="Center" WidthRequest="300" Source="maco.jpg"/>
        <Frame BackgroundColor="#BF043055" HasShadow="False">


            <StackLayout Orientation="Vertical" Spacing="10">
                <Label x:Name="lblError" TextColor="Red"></Label>
                <Entry x:Name="txtUserName" Text="Binding Email" Placeholder="Email"   
                   PlaceholderColor="White" HeightRequest="40"   
                   Keyboard="Email"  
                   TextColor="White"/>
                <Entry x:Name="txtPassword" Text="Binding Password" Placeholder="Password"   
                   PlaceholderColor="White" HeightRequest="40"   
                   IsPassword="True"  
                   TextColor="White"/>
            </StackLayout>
        </Frame>
        <Button  Text="Login" TextColor="White"  
            FontAttributes="Bold" FontSize="Large" HorizontalOptions="FillAndExpand"  
            BackgroundColor="#088da5" />

        <StackLayout HeightRequest="40" VerticalOptions="End">
            <ActivityIndicator IsRunning="True"
                 IsVisible="True"
                  HeightRequest="40"
                  VerticalOptions="CenterAndExpand"
                  HorizontalOptions="CenterAndExpand">
                <ActivityIndicator.WidthRequest>
                    <OnPlatform x:TypeArguments="x:Double" iOS="100" Android="100"/>
                </ActivityIndicator.WidthRequest>
                <ActivityIndicator.Color>
                    <OnPlatform x:TypeArguments="Color"
              iOS="#2499CE" />
                </ActivityIndicator.Color>
            </ActivityIndicator>
        </StackLayout>

    </StackLayout>


</ContentPage.Content>