Как сделать предварительный просмотр изображения больше?

Question

Я делаю модуль, который в значительной степени сделает то же самое с управляющим каталогом. В моем модуле мне нужно загрузить изображение. До сих пор все в порядке. Проблема в том, что я не могу найти способ, когда я загружаю изображение, и перейти к редактированию этого продукта, изображение составляет 22x22 px.

Мое поле в форме такова:

$fieldset->addField('imagebook', 'image', array(
          'label'     => Mage::helper('books')->__('Image'),
          'required'  => false,
          'name'      => 'imagebook',

       ));

Итак, мой вопрос с изображения ниже. Как я могу сделать это изображение больше? Когда я редактирую CSS, которые Magento использует его, измените все предварительные изображения для всего сайта.

Спасибо заранее за ваше время.

Answer 1

Вы можете добавить HTML -контент после вашего элемента, используйте следующее:

$field = $fieldset->addField('imagebook', 'image', array(
    'label' => Mage::helper('books')->__('Image'),
    'required' => false,
    'name' => 'imagebook',
));

$imageUrl = Mage::registry('model')->getImageUrl();

$field->setAfterElementHtml(
    "<img src='$imageUrl' class='some_class'/> "
);

Здесь $imageUrl Это ссылка на загруженное изображение, я получаю его от своей модели, но ваша может отличаться, вы можете получить его с помощью собственной логики. А также добавить несколько правил CSS для some_class.

Answer 2

Изображение, которое вы указали, добавляется через Mage_Adminhtml_Block_Catalog_Product_Helper_Form_Image класс, который, в свою очередь, использует Varien_Data_Form_Element_Image

Если вы посмотрите на функцию getElementHtml на Varien_Data_Form_Element_Image Вы увидите жесткую высоту и ширину.

/**
 * Return element html code
 *
 * @return string
 */
public function getElementHtml()
{
    $html = '';

    if ((string)$this->getValue()) {
        $url = $this->_getUrl();

        if( !preg_match("/^http\:\/\/|https\:\/\//", $url) ) {
            $url = Mage::getBaseUrl('media') . $url;
        }

        $html = '<a href="' . $url . '"'
            . ' onclick="imagePreview(\'' . $this->getHtmlId() . '_image\'); return false;">'
            . '<img src="' . $url . '" id="' . $this->getHtmlId() . '_image" title="' . $this->getValue() . '"'
            . ' alt="' . $this->getValue() . '" height="22" width="22" class="small-image-preview v-middle" />'
            . '</a> ';
    }
    $this->setClass('input-file');
    $html .= parent::getElementHtml();
    $html .= $this->_getDeleteCheckbox();

    return $html;
}

Я бы предложил, чтобы вы могли переписать Mage_Adminhtml_Block_Catalog_Product_Helper_Form_Image класс и создайте getElementHtml Функция, которая установит желаемую ширину и высоту.

В качестве альтернативы вы можете использовать мероприятие adminhtml_catalog_product_edit_element_types и создайте пользовательский обработчик типа. Затем вам нужно обновить тип поля при добавлении из image к чему -то вроде new_image.

$response = $observer->getEvent()->getResponse();
$types = $response->getTypes();
$types['new_image'] = Mage::getConfig()->getBlockClassName('new_image/element_image');
$response->setTypes($types);

Answer 3

Я принял ответ @mageuz, и он работает, но я также обнаружил, что решение, которое быстрее и проще, я думаю. Если вы добавите файл CSS внутри Skin/Adminhtml/default/default/yourfile.css с этим, это делает трюк:

#imagebook_image {
display: block;
max-width: 200px;
max-height: 200px;
width: auto;
height: auto;
padding-bottom: 10px;
}

ImageBook_Image сделан по имени и типу вашего столбца. Я не нашел ничего, что можно сломать.