ExCheckbox

<VBox class="sapUiMediumMargin" width="100%">

  <!-- State -->
  <ux7:ExTitle text="State" level="h3" variant="section" />
  <FlexBox wrap="Wrap" class="sapUiSmallMarginBottom">
    <ux7:ExCheckbox id="chkDefault" text="Default" class="sapUiSmallMarginEnd" />
    <ux7:ExCheckbox id="chkSelected" text="Selected" selected="true" class="sapUiSmallMarginEnd" />
    <ux7:ExCheckbox id="chkIndeterminate" text="Indeterminate" indeterminate="true" class="sapUiSmallMarginEnd" />
    <ux7:ExCheckbox id="chkDisabled" text="Disabled" enabled="false" class="sapUiSmallMarginEnd" />
    <ux7:ExCheckbox id="chkReadOnly" text="ReadOnly" selected="true" readOnly="true" class="sapUiSmallMarginEnd" />
    <ux7:ExCheckbox id="chkLoading" text="Loading" loading="true" />
  </FlexBox>

  <!-- Size -->
  <ux7:ExTitle text="Size" level="h3" variant="section" />
  <FlexBox wrap="Wrap" class="sapUiSmallMarginBottom">
    <ux7:ExCheckbox id="chkSm" text="Small (sm)" size="sm" selected="true" class="sapUiSmallMarginEnd" />
    <ux7:ExCheckbox id="chkMd" text="Medium (md)" size="md" selected="true" class="sapUiSmallMarginEnd" />
    <ux7:ExCheckbox id="chkLg" text="Large (lg)" size="lg" selected="true" class="sapUiSmallMarginEnd" />
    <ux7:ExCheckbox id="chkXl" text="XLarge (xl)" size="xl" selected="true" class="sapUiSmallMarginEnd" />
    <ux7:ExCheckbox id="chkXxl" text="XXLarge (xxl)" size="xxl" selected="true" />
  </FlexBox>

  <!-- Variant -->
  <ux7:ExTitle text="Variant" level="h3" variant="section" />
  <FlexBox wrap="Wrap" class="sapUiSmallMarginBottom">
    <ux7:ExCheckbox id="chkVarDefault" text="Default" variant="default" selected="true" class="sapUiSmallMarginEnd" />
    <ux7:ExCheckbox id="chkVarOutlined" text="Outlined" variant="outlined" selected="true" class="sapUiSmallMarginEnd" />
    <ux7:ExCheckbox id="chkVarSoft" text="Soft" variant="soft" selected="true" />
  </FlexBox>

  <!-- Color -->
  <ux7:ExTitle text="Color" level="h3" variant="section" />
  <FlexBox wrap="Wrap" class="sapUiSmallMarginBottom">
    <ux7:ExCheckbox id="chkColPrimary" text="Primary" color="primary" selected="true" class="sapUiSmallMarginEnd" />
    <ux7:ExCheckbox id="chkColSuccess" text="Success" color="success" selected="true" class="sapUiSmallMarginEnd" />
    <ux7:ExCheckbox id="chkColDanger" text="Danger" color="danger" selected="true" class="sapUiSmallMarginEnd" />
    <ux7:ExCheckbox id="chkColWarning" text="Warning" color="warning" selected="true" />
  </FlexBox>

  <!-- Description + Required -->
  <ux7:ExTitle text="Description + Required" level="h3" variant="section" />
  <FlexBox wrap="Wrap" class="sapUiSmallMarginBottom">
    <ux7:ExCheckbox id="chkDesc" text="E-posta bildirimleri" description="Kampanya ve duyurular için" required="true" class="sapUiSmallMarginEnd" />
    <ux7:ExCheckbox id="chkIcon" text="Favorilere ekle" icon="sap-icon://favorite" color="warning" />
  </FlexBox>

  <!-- Group — Vertical -->
  <ux7:ExTitle text="CheckboxGroup (Vertical)" level="h3" variant="section" />
  <ux7:ExCheckboxGroup id="chkGroupV" title="Bildirim Tercihleri" description="En az 1 seçenek seçin" orientation="vertical" required="true" minSelected="1">
    <ux7:ExCheckbox text="E-posta" key="email" selected="true" />
    <ux7:ExCheckbox text="SMS" key="sms" />
    <ux7:ExCheckbox text="Push Bildirimi" key="push" selected="true" />
    <ux7:ExCheckbox text="Telefon" key="phone" enabled="false" />
  </ux7:ExCheckboxGroup>

  <!-- Group — Horizontal -->
  <ux7:ExTitle text="CheckboxGroup (Horizontal)" level="h3" variant="section" />
  <ux7:ExCheckboxGroup id="chkGroupH" title="Günler" orientation="horizontal" color="success" maxSelected="5">
    <ux7:ExCheckbox text="Pzt" key="mon" selected="true" />
    <ux7:ExCheckbox text="Sal" key="tue" selected="true" />
    <ux7:ExCheckbox text="Çar" key="wed" selected="true" />
    <ux7:ExCheckbox text="Per" key="thu" />
    <ux7:ExCheckbox text="Cum" key="fri" selected="true" />
    <ux7:ExCheckbox text="Cmt" key="sat" />
    <ux7:ExCheckbox text="Paz" key="sun" />
  </ux7:ExCheckboxGroup>

</VBox>