デザインこんにちは、ハヤマです。先日、アームズの公式Instagramを開設しました!今後こちらのアカウントでアームズの最新情報などを(時にはゆる〜く)発信していきたいと思っています。覗いてみてくださいね。XDの「2020年1月アップデートリリースで新たに追加された新機能」のなかで、「コンテンツに応じたレイアウト」というものに興味を持ったのでまとめてみたいと思います。XDの機能ページによると、「コンテンツに応じたレイアウトを有効にしたグループは、グループ内のオブジェクト間の関係を把握し、オブジェクトの追加や変更によるレイアウト調整を自動的に行います。」と紹介されています。今回のリリースでは、「いくつかのレイヤーをグループ化した時、グループ全体のパディング値の指定が可能になった」とのこと。現段階の操作性について試してみたいと思います。実際にさわってみたちなみにこちらの機能はプラグインではなく、XDの最新バージョンであればすぐに使用できます。例として、以下のような“1つの記事を構成するオブジェクト・テキストのまとまり”があるとします。こちらをグループ化します。(敢えて四隅の余白値はバラバラにしています)2「パディング」プロパティをアクティブに1にてグループ化したオブジェクトを選択したまま、画面右にあるプロパティインスペクターの「パディング」をアクティブにします。指定方法は以下の2種類です。(1)上下左右に同じパディングこちらを選択すると、四辺のパディングを一括指定できます。(2)上下左右に異なるパディングこちらを選択すると、四辺のパディングをそれぞれ指定できます。上記を設定すると、グループレイヤーのサイズを変更した際にも必ず指定サイズで余白が保持されます。設定後も値の増減が自由なので、便利ですね。グループ内に新たなオブジェクトを追加しても、その親となるグループで指定したパディング値は保持されるコンテナやセクションごとにグループ化して余白管理をしても便利かなと思いました。さいごに「コンテンツに応じたレイアウト」機能を使用することで、パディングを設定した親グループを解除しない限り値が保持されるため、レイアウトの効率化に繋がると感じました。以下のページで解説動画(英語)とダウンロードできるサンプルデータが紹介されています。興味のある方は、ぜひ参考にしてみてください。letsxd.com最近のXDの進化は目を見張るものがありますね。今後のリリース情報も楽しみです。HTMLメールを作る時の注意点こんにちは、中村です。12月とか信じられないです。シリーズPart3です...2019-10-30シンプルで使いやすい!バリデーションライブラリ「Valitron」の使い方こんにちは、コバヤシです。(1)月別アーカイブ執筆者リストid:xkatoid:arms_hayamaid:arms-nakamuraid:hide_san99id:masakikojimaプロフィール株式会社アームズのエンジニアブログです。読者になるはてなブログをはじめよう!hide_san99さんは、はてなブログを使っています。ブログを報告するスターをつけました引用をストックしましたストック一覧を見る閉じる引用するにはまずログインしてくださいログイン閉じる引用をストックできませんでした。再度お試しください閉じる限定公開記事のため引用できません。