attribute-radiobutton は項目属性クラスからプロパティを継承するクラスで、具体的には
[ Control Type ] プロパティが Radio Button に設定されているコントロールに適用されます。
Work With パターンを生成する際に、
[ Control Type ] プロパティが Radio Button に設定されている項目属性にこの特定のクラスを自動的に割り当てることができます。
まず
Design System オブジェクトの
[ Styles ] エレメントで、項目属性に目的の汎用スタイルを指定して項目属性クラスを作成します:
.Attribute {
gx-label-class: attribute__label;
border-style: solid;
border-color: #8592A6;
border-width: 1dip;
border-radius: 4dip;
margin-left: 16dip;
margin-right: 16dip;
margin-bottom: 8dip;
background-color: $colors.surface;
padding-left: 8dip;
padding-right: 8dip;
gx-show-edit-text-line: false;
color: #3D4854;
gx-invite-message-color: #8592A6;
font-size: 16dip;
font-family: $fonts.primary-regular;
}
ここで、項目属性/変数がラジオボタンである場合には境界線を表示しないようにし、左のパディングを 0 にすると、次のようになります:
定義するクラスは次のようになります:
.attribute-radiobutton {
@include Attribute;
border-style: none;
padding-left: 0dip;
}
デザインシステムのクラス