Adobe XDでマスクを作成する

XDのデータから書き出しをする際、一部マスクをかけた状態で書き出しを行いということがたまにあるので、マスクのかけかたについてメモ。

作成方法

今回は以下のように、画像がアートボードの範囲外にはみ出ている例で試してみます。

この状態で画像を選択して書き出すと、アートボード範囲外の部分も含めて画像の書き出しが行われます。

実際にマスクの作成を試してみます。
長方形ツールを選択して、マスクをかけたい範囲を描画します。

今描画したレイヤーとマスクをかけるレイヤーを選択して、オブジェクト > シェイプでマスク を選択します。
ショートカットキーの場合は Command + Shift + M になります。

これでマスクの作成ができました。

この状態で書き出すと、マスクのかかった状態での書き出しができました。