Su componente de interfaz de usuario xml debería tener esto agregado:
<column name="image" class="Your\Modulename\Ui\Component\Listing\Column\Thumbnail">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="component" xsi:type="string">Magento_Ui/js/grid/columns/thumbnail</item>
<item name="sortable" xsi:type="boolean">false</item>
<item name="altField" xsi:type="string">title</item>
<item name="has_preview" xsi:type="string">1</item>
<item name="label" xsi:type="string" translate="true">Thumbnail</item>
</item>
</argument>
</column>
..y luego en Your \ Modulename \ Ui \ Component \ Listing \ Column \ Thumbnail.php algo similar a esto:
<?php
namespace Your\Modulename\Ui\Component\Listing\Column;
use Magento\Catalog\Helper\Image;
use Magento\Framework\UrlInterface;
use Magento\Framework\View\Element\UiComponentFactory;
use Magento\Framework\View\Element\UiComponent\ContextInterface;
use Magento\Store\Model\StoreManagerInterface;
use Magento\Ui\Component\Listing\Columns\Column;
class Thumbnail extends Column
{
const ALT_FIELD = 'title';
/**
* @var \Magento\Store\Model\StoreManagerInterface
*/
protected $storeManager;
/**
* @param ContextInterface $context
* @param UiComponentFactory $uiComponentFactory
* @param Image $imageHelper
* @param UrlInterface $urlBuilder
* @param StoreManagerInterface $storeManager
* @param array $components
* @param array $data
*/
public function __construct(
ContextInterface $context,
UiComponentFactory $uiComponentFactory,
Image $imageHelper,
UrlInterface $urlBuilder,
StoreManagerInterface $storeManager,
array $components = [],
array $data = []
) {
$this->storeManager = $storeManager;
$this->imageHelper = $imageHelper;
$this->urlBuilder = $urlBuilder;
parent::__construct($context, $uiComponentFactory, $components, $data);
}
/**
* Prepare Data Source
*
* @param array $dataSource
* @return array
*/
public function prepareDataSource(array $dataSource)
{
if(isset($dataSource['data']['items'])) {
$fieldName = $this->getData('name');
foreach($dataSource['data']['items'] as & $item) {
$url = '';
if($item[$fieldName] != '') {
$url = $this->storeManager->getStore()->getBaseUrl(
\Magento\Framework\UrlInterface::URL_TYPE_MEDIA
).'pathtoyourimage/'.$item[$fieldName];
}
$item[$fieldName . '_src'] = $url;
$item[$fieldName . '_alt'] = $this->getAlt($item) ?: '';
$item[$fieldName . '_link'] = $this->urlBuilder->getUrl(
'your_module/yourentity/edit',
['yourentity_id' => $item['yourentity_id']]
);
$item[$fieldName . '_orig_src'] = $url;
}
}
return $dataSource;
}
/**
* @param array $row
*
* @return null|string
*/
protected function getAlt($row)
{
$altField = $this->getData('config/altField') ?: self::ALT_FIELD;
return isset($row[$altField]) ? $row[$altField] : null;
}
}
¡Espero que eso ayude!
if($item[$fieldName] != '')
aif($item['url'] != '')
y'pathtoyourimage/'.$item[$fieldName]
para'pathtoyourimage/'.$item['url']
. Mi$fieldName
regresaba 'imagen' sin embargo, mi campo db fue llamado 'url'. El resto de los que$item[$fieldName . '***']
quedaron en su lugar.En tu grid.php define como a continuación
Crear
Image.php
bajoy pegue debajo del código
fuente
Simplemente agregue esta etiqueta en su
ui_component
archivo de diseñoy crea este nuevo archivo que tenemos asignado en nuestra
ui_component
columnaEn
prepareDataSource
función obtendrá cada objeto de columna.Espero que esto te ayudará.
fuente
Finalmente, tengo una solución para mi pregunta. He agregado una columna de cuadrícula con el nombre del bloque de representación como parámetro.
Luego agregué un bloque de renderizado como se muestra a continuación:
Espero que esto ayude.
fuente