Renderer in Mаgentо 2.0

Renderer in Mаgentо 2.0

Let’s take a look at a few cases when it may be required to add a custom element. The main place is the admin panel. We might require the following elements:

  1. A column in a Grid;
  2. A form element;
  3. Config element as described in the system.xml file.

1. Grid

There are 2 ways to implement depending on how the column list is generated.

– Via xml

The column itself will be rendered by the standard block:
Magento\Backend\Block\Widget\Grid\Column

The collection will be generated via our resource:
MyVendor\MyExtension\Model\Resource\Grid\Collection

It is also possible to modify the filter of our custom column.

Column values will be rendered by our Block:
MyVendor\MyExtension\Block\Adminhtml\Grid\Renderer\Customcolumn

It is also possible to monitor and change not the column Abstract itself, but one of the already created external elements. For example:

Magento\Backend\Block\Widget\Grid\Column\Renderer\Checkbox,

or

Magento\Backend\Block\Widget\Grid\Column\Renderer\Date

Here you will find all the ready-to-use basic templates.

 

– inside of the block

The render is a full match to the previous one.

 

2. Form

It is all simple here. The field can be declared as any type. You just need to replace the render block as follows:

Now let’s take a look at the structure of the render field:

MyVendor\MyExtension\Block\Adminhtml\Form\Renderer\Customfield

It is possible either to process HTML inside the render function here or to replace the default template by adding the variable $_template with our template.

Besides the Abstract element we can also inherit and modify such elements as:

Magento\Backend\Block\Widget\Form\Element\Gallery

or

Magento\Backend\Block\Widget\Form\Element\Dependence

Controller and Model allow you to change the process of saving the custom field, for which this form has been generated. But there is nothing unusual here, so, let’s move on.

 

3. System.xml

3 class types can be set in the Config section:

– frontend_model – this block controls the frontend;

– backend_model – this model manages reading and saving;

– sourse_model – this model is used for fields that have a fixed number of values, described here.

Of course, it is possible to not indicate each of the 3 classes, it depends on what exactly we are going to modify. Or we can indicate one of the default options, as described in the case with the sоurсe_mоdel: Magento\Config\Model\Config\Source\Yesno

 

– frontend_model

It is possible to customize one of the ready-made elements. For example:

Magento\Config\Block\System\Config\Form\Field\Image

or

Magento\Config\Block\System\Config\Form\Field\File

 

– backend_model

While customizing one of the standard elements we inherit one of the models here:

Magento\Config\Model\Config\Backend\ . . .

 

– source_model

This is, perhaps, the most popular type of customization: to define your own selection options for settings.



Post a new comment

top