Magento 2 Add multiple checkbox in admin ui form Group component

Question

How do I add dinamically add multiple checkbox bellow the a field

This is how you add one checkbox bellow a field

<fieldset name="field_set_name" sortOrder="100">
        <settings>
            <collapsible>true</collapsible>
            <label translate="true">Field Set Name</label>
        </settings>
        <container name="field_set_group" component="Magento_Ui/js/form/components/group" sortOrder="110">
            <argument name="data" xsi:type="array">
                <item name="type" xsi:type="string">group</item>
                <item name="config" xsi:type="array">
                    <item name="required" xsi:type="boolean">false</item>
                </item>
            </argument>
            <field name="1_field_name" sortOrder="10" formElement="input">
                <argument name="data" xsi:type="array">
                    <item name="config" xsi:type="array">
                        <item name="source" xsi:type="string">source</item>
                    </item>
                </argument>
                <settings>
                    <label translate="true">1 Field Name</label>
                </settings>
            </field>
            <field name="2_field_name" component="Magento_Catalog/js/components/url-key-handle-changes" sortOrder="15" formElement="checkbox">
                <settings>
                    <dataType>boolean</dataType>
                </settings>
                <formElements>
                    <checkbox>
                        <settings>
                            <description translate="true">2 Field name</description>
                            <valueMap>
                                <map name="false" xsi:type="number">0</map>
                                <map name="true" xsi:type="number">1</map>
                            </valueMap>
                        </settings>
                    </checkbox>
                </formElements>
            </field>
        </container>
    </fieldset>

AND I need something like this:

Answer 1

Paste this Code in your ui-component

<fieldset name="custom_checkbox"class="Vendor\Module\Ui\Component\Form\CustomCheckbox">
    <argument name="data" xsi:type="array">
        <item name="config" xsi:type="array">
            <item name="label" xsi:type="string">Custom Checkboxes</item>
        </item>
    </argument>
</fieldset>

Create a CustomCheckbox.php in

Vendor\Module\Ui\Component\Form\

<?php
namespace Vendor\Module\Ui\Component\Form;


use Magento\Framework\View\Element\UiComponent\ContextInterface;
use Magento\Framework\View\Element\UiComponentInterface;
use Magento\Ui\Component\Form\FieldFactory;
use Magento\Ui\Component\Form\Fieldset as BaseFieldset;

class CustomCheckbox extends BaseFieldset
{
    /**
     * @var FieldFactory
     */
    private $fieldFactory;

    public function __construct(
        ContextInterface $context,
        array $components = [],
        array $data = [],
        FieldFactory $fieldFactory)
    {
        parent::__construct($context, $components, $data);
        $this->fieldFactory = $fieldFactory;
    }

    /**
     * Get components
     *
     * @return UiComponentInterface[]
     * @throws \Magento\Framework\Exception\LocalizedException
     */
    public function getChildComponents()
    {
        // $stores = $this->getStoreData();
        $checkBoxes = [['value' => 1, 'label' => 'Checkbox 1'], ['value' => 2, 'label' => 'Checkbox 2'], ['value' => 3, 'label' => 'Checkbox 3']];

        foreach ($checkBoxes as $checkBox) {
            $storeName = $checkBox['label'];


            $fields[] =
                [
                    'label' => __('"' . $checkBox['label'] . '"'),
                    'formElement' => 'checkbox',
                    'value' => $checkBox['value'],
                ];
        }

        foreach ($fields as $k => $fieldConfig) {
            $fieldInstance = $this->fieldFactory->create();

            $name = $k;

            $fieldInstance->setData(
                [
                    'config' => $fieldConfig,
                    'name' => $name,
                ]
            );

            $fieldInstance->prepare();
            $this->addComponent($name, $fieldInstance);
        }

        return parent::getChildComponents();
    }
}

This code Worked for me fine :)

Answer 2

Another solution that I found was the bellow:

<field name="customCheckBoxField">
            <argument name="data" xsi:type="array">
                <item name="label" xsi:type="string" translate="true">Checkboxes</item>
                <item name="options" xsi:type="object">Vendor\Module\Model\Config\Checkbox</item>
                <item name="config" xsi:type="array">
                    <item name="label" xsi:type="string" translate="true">Custom Label</item>
                    <item name="visible" xsi:type="boolean">true</item>
                    <item name="dataType" xsi:type="string">text</item>
                    <item name="formElement" xsi:type="string">checkboxset</item>
                    <item name="source" xsi:type="string">module</item>
                    <item name="multiple" xsi:type="boolean">true</item>
                    <item name="dataScope" xsi:type="string">customCheckBoxField</item>
                </item>
            </argument>
        </field>

Then in Vendor\Module\Model\Config\Checkbox

 ...
 public function toOptionArray()
    {
        return [['value' => 1, 'label' => __('field 1')], 
                ['value' => 2, 'label' => __('field 2')], 
                ['value' => 3, 'label' => __('field 3')]
               ];
    }
 ...

This is a screen shot is a combination from Gee Emm and my Answer: