【问题标题】:Frame corner radius not rounding corners on iOSiOS上的框架角半径不是圆角
【发布时间】:2018-08-12 00:27:29
【问题描述】:

我正在尝试绕过堆栈布局的角落,它适用于 android,但在 iOS 上,它们仍然显示为方形,但确实显示了 Frame 阴影

我的 XAML 是

<ContentPage.Content>
    <StackLayout BackgroundColor="WHITE">
        <ListView>
            <ListView.ItemTemplate>
                <DataTemplate>
                    <ViewCell>
                        <StackLayout>
                            <Frame CornerRadius="10" Padding="0" Margin="10, 10, 10, 10">
                                <StackLayout>
                                    . . .
                                </StackLayout>
                            </Frame>
                        </StackLayout>
                    </ViewCell>
                </DataTemplate>
            </ListView.ItemTemplate>
        </ListView>
    </StackLayout>
</ContentPage.Content>

【问题讨论】:

  • 有什么想法吗?我需要找到解决此问题的方法。

标签: xaml xamarin xamarin.forms xamarin.ios


【解决方案1】:

它们仍然是方形的

其实Frame是圆的而不是StackLayout,我们只是用Frame包裹它,所以看起来StackLayout有圆角。

框架

<Frame CornerRadius="10" Padding="0" Margin="10, 10, 10, 10" HasShadow="False" BackgroundColor="Red">
    <StackLayout >
         <Label Text="{Binding}"/>
    </StackLayout>
</Frame>

堆栈布局

<Frame CornerRadius="10" Padding="0" Margin="10, 10, 10, 10" HasShadow="False" >
   <StackLayout BackgroundColor="Red">
         <Label Text="{Binding}"/>
   </StackLayout>
</Frame>

它确实显示了框架阴影

您可以通过HasShadow="False"禁用它。

【讨论】:

  • 问题是它不是环绕它在 iOS 上显示为正方形的角,而是在 Android 上是圆形
  • @Dan 看截图。
  • @ColeXia-MSFT 如果您正在开发跨平台应用程序,我相信这是一种解决方法,但不是解决方案。请参阅下面的答案。
【解决方案2】:

其实我相信,这是 Xamarin.Forms 的一个 bug。 UWP、Android 和 iOS 的行为应该相同,但事实并非如此。因此,要实现相同的行为,开发人员需要使用 OnPlatform 功能。

这里描述和讨论了这个错误,它仍然是开放的:https://github.com/xamarin/Xamarin.Forms/issues/2405

【讨论】:

    【解决方案3】:

    IsClippedToBounds属性设置为Frame控件:

    <Frame IsClippedToBounds="True" CornerRadius="10" Padding="0" Margin="10, 10, 10, 10">
        <StackLayout>
        </StackLayout>
    </Frame>
    

    【讨论】:

      猜你喜欢
      • 2011-10-27
      • 2015-05-15
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2016-03-28
      • 1970-01-01
      • 2021-12-27
      • 1970-01-01
      相关资源
      最近更新 更多