Magento 2.3.2 How to add Multiline component field in admin form using ui component

Question

I want to add a field like Street address in my custom module. same as customer Address Add from back-end form. it will look like below image.

How can I add this kind of field using the UI component?

---

UPDATE:

I have used the below code to display a multiline component. But it is not displaying a filed label.

<field name="address">
            <argument name="data" xsi:type="array">
                <item name="config" xsi:type="array">
                    <item name="component" xsi:type="string" translate="true">Magento_Ui/js/form/components/group</item>
                    <item name="dataType" xsi:type="string">text</item>
                    <item name="size" xsi:type="number">2</item>
                    <item name="formElement" xsi:type="string">multiline</item>
                    <item name="visible" xsi:type="boolean">true</item>
                    <item name="source" xsi:type="string">store</item>
                    <item name="validation" xsi:type="array">
                        <item name="required-entry" xsi:type="boolean">true</item>
                    </item>
                </item>
                <item name="label" xsi:type="string" translate="true">Street</item>
            </argument>
        </field>

And also I would like to create a field using a new UI-component form method, the above code is an older method.

Any help would be appreciated!

Answer 1

About multiline fields data, it's render from vendor/magento/module-ui/Component/Form/Element/Multiline.php file.

It seems like there are no label fields added before prepare data. So, you need to override the file or use plugin for that.

For testing, you can write code in core file and add this below code :

vendor/magento/module-ui/Component/Form/Element/Multiline.php

public function prepare() {
    $size = abs((int) $this->getData('config/size'));
    $validation = [$this->getData('config/validation')];
    while ($size--) {
        $identifier = $this->getName() . '_' . $size;
        $arguments = [
            'data' => [
                'name' => $identifier,
                'config' => [
                    'dataScope' => $size,
                    'dataType' => static::DATA_TYPE,
                    'formElement' => static::FORM_ELEMENT,
                    'sortOrder' => $size,
                ],
            ],
        ];

        if (!empty($validation[$size])) {
            $arguments['data']['config']['validation'] = $validation[$size];
        }
        // For display label
        if($this->getData('config/formElement') == 'multiline' && $this->getData('config/label') != ''){
            $arguments['data']['config']['label'] = $this->getData('config/label');
        }
        $component = $this->uiComponentFactory->create($identifier, Field::NAME, $arguments);
        $component->prepare();

        $this->components[$identifier] = $component;
    }
    parent::prepare();
}

Note : I do not recommended to change in core files. Create plugins for that.