How to create an extension dropdown config option in Magento 2

November 23, 2015 - Fire development, Magento 2

Magento 2 Development

To create an extension’s dropdown config option in Magento 2 check the core example: «Catalog» → «Storefront» → «List Mode».

The following code is the field XML declaration:

<field id="list_mode" translate="label" type="select" sortOrder="1" showInDefault="1" showInWebsite="1" showInStore="1">
   <label>List Mode</label>
   <source_model>Magento\Catalog\Model\Config\Source\ListMode</source_model>
</field>

<source_model>Magento\Catalog\Model\Config\Source\ListMode</source_model>

</field>

Please note that :

type=”select” defines the dropdown control, while

<source_model>Magento\Catalog\Model\Config\Source\ListMode</source_model> defines the dropdown items.

class ListMode implements \Magento\Framework\Option\ArrayInterface
{
/**
 * {@inheritdoc}
 *
 * @codeCoverageIgnore
 */
public function toOptionArray()
{
   return [
       ['value' => 'grid', 'label' => __('Grid Only')],
       ['value' => 'list', 'label' => __('List Only')],
       ['value' => 'grid-list', 'label' => __('Grid (default) / List')],
       ['value' => 'list-grid', 'label' => __('List (default) / Grid')]
   ];
}
}