影

シャドウはインターフェイスに視覚的な手がかりを作成します。これは、人間の脳がユーザーに表示されるUI要素を区別するのに役立ちます。 そして、これが実際にモバイルデザイナーがデザインに影を組み込むことを好む理由です。

API

DropShadowクラスは、レイアウトに適用できる構成可能なシャドウを作成する手段を提供します。

プロパティ

• 半径：影を生成するために使用されるガウスぼかしの半径。
• 色：影の色。
• オフセット：レイアウトに対するシャドウのオフセット。
• 不透明度：影の不透明度。

public class DropShadow : BindableObject
{
    public static readonly BindableProperty RadiusProperty = BindableProperty.Create(
        nameof(Radius), typeof(double), typeof(DropShadow), 10.0d);

    public double Radius
    {
        get => (double)GetValue(RadiusProperty);
        set => SetValue(RadiusProperty, value);
    }

    public static readonly BindableProperty ColorProperty = BindableProperty.Create(
        nameof(Color), typeof(Color), typeof(DropShadow), Color.Black);

    public Color Color
    {
        get => (Color)GetValue(ColorProperty);
        set => SetValue(ColorProperty, value);
    }    

    public static readonly BindableProperty OffsetProperty = BindableProperty.Create(
        nameof(Offset), typeof(Point), typeof(DropShadow), new Point(1, 1));

    public Point Offset
    {
        get => (Point)GetValue(OffsetProperty);
        set => SetValue(OffsetProperty, value);
    }

    public static readonly BindableProperty OpacityProperty = BindableProperty.Create(
        nameof(Opacity), typeof(double), typeof(DropShadow), 1.0d);

    public double Opacity
    {
        get => (double)GetValue(OpacityProperty);
        set => SetValue(OpacityProperty, value);
    }
}

シナリオ

C＃、XAML、CSSを使用した例を見てみましょう。

C＃の例

var layout = new Grid();

var shadow = new DropShadow ();
shadow.Radius = 12;
shadow.Color = Color.Red;
shadow.Offset = new Point (12, 18);
shadow.Opacity = 0.75d;

layout.Shadow = shadow;

XAMLの例

<Grid>
     <Grid.Shadow>
          <DropShadow
               Radius="12"
               Color="Red"
               Offset="12, 18"
               Opacity="0.75" />
     </Grid.Shadow>
</Grid>

CSSの例

box-shadow: 12px 18px 12px 12px red;

下位互換性

一部のXamarin.Formsレイアウトにはすでに影があります。 フレームのHasShadowプロパティは非推奨になります（Shadowプロパティの使用が

範囲

この仕様では、さまざまなXamarin.Formsレイアウトにシャドウを追加します。 ラベルなどの特定のコントロールはスコープに含まれません（後で来る可能性があります）。

難易度：中