【问题标题】:SkiaSharp Canvas button doesn't workSkiaSharp 画布按钮不起作用
【发布时间】:2017-07-14 18:49:30
【问题描述】:

我有一个Xamrin Form,其网格布局如下所示。有一个带有渐变颜色的SkiaSharp 画布。我需要在画布内添加一个按钮以获取渐变背景。但是当我在画布内添加按钮时,它不会呈现任何内容(按钮 x:Name="ClickMe2")。使用渐变背景渲染按钮的正确方法是什么?

XAML

<Grid x:Name="controlGrid">
    <Grid.RowDefinitions>
        <RowDefinition Height="200" />
        <RowDefinition Height="*" />
    </Grid.RowDefinitions>
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="*" />
        <ColumnDefinition Width="*" />
    </Grid.ColumnDefinitions>
    <views:SKCanvasView PaintSurface="OnSecondPainting" EnableTouchEvents="True" Grid.Row="0" Grid.Column="0" Grid.ColumnSpan="2" >
        <Button x:Name="ClickMe2" Text="ClickMe 2" HeightRequest="50"  VerticalOptions="Start" />
    </views:SKCanvasView>
    <Label Text="Bottom Left" Grid.Row="1" Grid.Column="0" />
    <Button x:Name="ClickMe1" Text="ClickMe 1" Grid.Row="1" Grid.Column="1" HeightRequest="50"  VerticalOptions="Start" />
</Grid>

C#

    private void OnSecondPainting(object sender, SKPaintSurfaceEventArgs e)
    {

        var surface = e.Surface;
        var canvas = surface.Canvas;
        canvas.Clear(SKColors.White);

        ///GRADIENT--------------------------------------------------------------------
        var colors = new SKColor[] { new SKColor(6, 107, 249), new SKColor(27, 162, 210), new SKColor(36, 182, 197) };
        var shader = SKShader.CreateLinearGradient(new SKPoint(300, 0), new SKPoint(300, 600), colors, null, SKShaderTileMode.Clamp);
        var paint = new SKPaint() { Shader = shader };
        canvas.DrawPaint(paint);


    }

【问题讨论】:

  • 我认为你应该用路径绘制,比如 DrawRect ?

标签: xamarin xamarin.forms skiasharp


【解决方案1】:

这是因为画布视图实际上并不是一个布局——它是一个View。这意味着它不支持儿童。

如果这确实是一个问题,请随时在 GitHub 上打开一个问题: https://github.com/mono/skiasharp/issues我们可以在那里讨论这个问题,也可以从社区获得意见(例如改变或新观点)

如果您想在画布上放置视图,可以使用GridRelativeLayoutAbsoluteLayout

<Grid>
    <views:SKCanvasView />
    <Button />
</Grid>

只要画布是第一个孩子,所有其他孩子都会出现在它上面。

【讨论】:

    猜你喜欢
    • 2016-04-29
    • 2016-03-21
    • 2012-10-30
    • 1970-01-01
    • 2018-05-10
    • 1970-01-01
    • 2014-01-18
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多