Создание компонента Битрикса (часть 2)

В предыдущей статья мы уже начали рассматривать создание компонента.

Теперь давайте создадим простой компонент, который бы выводил записи из инфоблока. Компонент будет располагаться в отдельном пространстве имен mir. Входными параметрами будут ID инфлоблока из которого брать элементы и величина выборки элементов.

Создадим в папке /bitrix/components новую папку mir. Это будет наше новое пространство имен.

Определим основные файлы компонента.

.description.php

// Запрещаем прямой доступ
if (!defined("B_PROLOG_INCLUDED") || B_PROLOG_INCLUDED!==true) die();
 
// Определяем массив
$arComponentDescription = array(
    "NAME" => GetMessage("NAME"), // Имя
    "DESCRIPTION" => GetMessage("DESCR"), // Описание
    "ICON" => "/images/news_all.gif", // Иконка
    "VERSION" => "1.00", // Версия
    "PATH" => array("ID" => "mir", // Расположение в виртуальном дереве компонентов
        "NAME" => GetMessage("MIR_GROUP_NAME"),
        "CHILD" => array("ID" => "system",
        "NAME" => GetMessage("SYSTEM_GROUP_NAME"),
     ),
),      
//"CACHE_PATH" => "Y",
//"COMPLEX" => "Y"
);

.parameters.php

// Запрещаем прямой доступ
if (!defined("B_PROLOG_INCLUDED") || B_PROLOG_INCLUDED!==true) die();
 
// Подключаем модуль информационных блоков
if(!CModule::IncludeModule("iblock"))
        return;
// Получаем список инфоблоков
$arIBlock=array();
$rsIBlock = CIBlock::GetList(Array("sort" => "asc"), Array("ACTIVE"=>"Y"));
while($arr=$rsIBlock->Fetch())
{
    $arIBlock[$arr["ID"]] = "[".$arr["ID"]."] ".$arr["NAME"];
}
 
// Массив описаний параметов компонента
$arComponentParameters = array(
    // Группы
    "GROUPS" => array(
        "IBLOCK_PARAMS" => array(
            "NAME" => GetMessage("IBLOCK_PARAMS_NAME")
        )
    ),
    // Массив описания параметров
    "PARAMETERS" => array(
        // ID инфоблока
        "IBLOCK_ID" => array(
            "PARENT" => "IBLOCK_PARAMS",
            "NAME" => GetMessage("IBLOCK_ID_NAME"),
            "TYPE" => "LIST",
            "VALUES" => $arIBlock,
            "REFRESH" => "Y"    
        ),
        // Количество элементов инфоблока для выборки
        "IBLOCK_ITEMS_COUNT" => array(
            "PARENT" => "IBLOCK_PARAMS",
            "NAME" => GetMessage("IBLOCK_ITEMS_COUNT_NAME"),
            "TYPE" => "LIST",
            "VALUES" => array('5' => '5', '10' => '10', '15' => '15'),
            "DEFAULT" => '2',
        ),
   
        "SET_TITLE" => array(),
        "CACHE_TIME" => array(),
   )
);

component.php

if(!defined("B_PROLOG_INCLUDED") || B_PROLOG_INCLUDED!==true) die();
 
$arResult = array();
 
if ($this->StartResultCache())
{
    $this->IncludeComponentTemplate();
}

Вы наверно заметили функции GetMessage? Теперь надо создать языковые файлы. Лежать они должны в папке lang/ru/ и называться должны как и файлы, переменные для котого в них определяются.

/lang/ru/.description.php

$MESS ['NAME'] = "Элементы инфоблока";
$MESS ['DESCR'] = "Тестовый компонент для статьи"; 
$MESS ['MIR_GROUP_NAME'] = "MIR components";
$MESS ['SYSTEM_GROUP_NAME'] = "Информационные блоки";

/lang/ru/.parameters.php

$MESS ['IBLOCK_PARAMS_NAME'] = "Параметры инфоблока"; 
$MESS ['IBLOCK_ID_NAME'] = "Инфолок";
$MESS['IBLOCK_ITEMS_COUNT_NAME'] = "Количество записей";

Отлично! Теперь в папке компонента создайте папку templates. В ней будут храниться шаблоны. Каждая папка — отдельный шаблон. Шаблон по умолчанию называется  .default, создайте такую папку и добавьте в нее файл template.php. Пусть он будет пока пустой.

Теперь все готово для добавления компонента на страницу. Создайте пустую страницу в битриксе, откройте ее через визуальный редактор. Вы должны увидеть следующее:

Теперь просто перетащите компонент на страницу. Он должен появится в области редактирования.

Сделайте двойной щелчок на нем, появится окно параметров.

Как видите, все получилось. Но наш компонент ничего не делать. Исправим это.

Логика компонента такова, что сначала он должен произвести выборку из назначенного нами инфоблока, а потом передать этим данные в шаблон, который из выведет на экран. Тут как раз и проявляется разделение логики и представления. В файле компонента component.php должна задаваться логика. Выходные данные должны быть помещены в массив $arResults. С этим массивом должен работать шаблон. В идеале шаблон не должен производить никаких манипуляций с этим массивом, только задавать способ вывода его на экран.

Параметры передаются как в сам компонент, так и в шаблон при помощи массива $arParams. Можно добавить следующую строчку в файл компонента:

print_r($arParams);

Вы увидите на странице компонента следующее:

Структура массива очень проста. Теперь создадим основную логику компонента.

Файл компонента должен принять вид:

StartResultCache())
{
    // Подключаем модуль информационных блоков
    if(!CModule::IncludeModule("iblock"))
        return;
    // Параметры сортировки
    $arSort = array("ID"=>"ASC");
    // Параметры фильтра
    $arFilter = array("ACTIVE" => "Y",
                      "IBLOCK_ID" => $arParams['IBLOCK_ID'],
                      );
    // Производим выборку из инфоблока
    $arRes = CIBlockElement::GetList($arSort, $arFilter);
     
    // Количество элементов
    $iCount = intval($arParams['IBLOCK_ITEMS_COUNT']);
    // Добавляем элементы в массив $arResult
    for($i = 0; $i < $iCount; $i++ ) {
        if(!$arr = $arRes->Fetch()) {
            break;
        }
         
        $arResult['items'][] = $arr;
    }
     
    $this->IncludeComponentTemplate();
}

Мы сначала сделали выборку из инфоблока стандартными методами API Битрикса. Потом мы добавили информацию о каждом элементе в массив $arResult и вызвали шаблон компонента.

Отредактируем файл template.php следующим образом:

 <div class="mir-iblock-list">
<?
foreach($arResult['items'] as $item):
?>
<div class="mir-iblock-item">
    <h2><?=$item['NAME']?></h2>
    <div><?=$item['PREVIEW_TEXT']?></div>
</div>
<?
endforeach;
?>
</div>

Как мы видим, у нас есть только шаблон для отображения информации, в который мы подставляем значения из инфоблока. Результат следующий:

Если вы хотите отдельные стили для своего компонента, то добавьте в папку компонента файл style.css. Битрикс его автоматически подключит.

Точно также Битрикс автоматически подключит файл script.js.

Вот и все. В данной заметке были изложены основные моменты создания своих компонентов.

Надеюсь данная статья будет кому-то полезна.

Вам также может понравиться

About the Author: Vladimir Kusakin

Hi. I am web developer. For the past 9 years, I've been developing applications for the web using mostly PHP and Python. About me

1 комментарий

Добавить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *