ДОСТУПНА НОВАЯ ВЕРСИЯ! Webix 11 Подробнее Обновления в Core, SpreadSheet, File Manager и Report Manager и многое другое

WEBIX JAVASCRIPT LIBRARY BLOG

Новости, релизы, помощь и советы по разработке web UI, новейшие тенденции и know-how практики по JavaScript программированию. Создавайте web интерфейсы быстрее и качественнее.

Подписывайтесь:

Пишите для нас: guest posts guidelines.

Комплексный контент в DataTable

DataTable — самый популярный виджет библиотеки компонентов Webix. Он быстрый, гибкий и может использоваться в самых разных сценариях. По умолчанию, в ячейках этого компонента отображается только текстовый контент. Тем не менее, вы можете использовать темплейты, чтобы показать более сложный контент в ячейках DataTable. Иконки, кнопки и даже другие виджеты могут использоваться в качестве темплейтов ячеек.

Давайте посмотрим, как это можно сделать.

Чекбоксы и радиокнопки

Самый распространенный вариант использования — это добавление чекбокса в ячейку DataTable. Поскольку этот сценарий используется довольно часто, мы сделали для него готовое решение. Вам просто нужно задать его в качестве значения темплейта ячейки вот так:

template:"{common.checkbox()}"

и вы получите полноценный чекбокс.

Data table

Совсем скоро: релиз Webix 3.1

Всем привет! Совсем скоро мы променяем зонты и резиновые сапоги на вязаные шапки и антифриз, но до этого момента успеем поделиться с вами нашим новым обновлением — Webix 3.1 , которое увидит свет уже 24 ноября.

Webix 3.1

 

Не так давно мы обсуждали планы крупного апдейта Webix 4.0. Признаемся, что некоторые фичи не вошли в версию 3.0, но это не значит, что мы про них забыли. Это значит, что они появятся в новых релизах.

Чего же ждать от Webix 3.1?

Как создать рабочий стол в браузере с помощью Webix

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

webix_new_demo

Что это?

Демо показывает, как можно создать рабочий стол в браузере на основе Webix компонента.

Такая оболочка может использоваться удаленными пользователями, поскольку она предоставляет среду, подобную десктопной, где пользователи могут получить доступ к удаленным данным и работать с ними. Пользователи могут запускать внутренние приложения, организовать их размещение на экране, а также переключаться между ними. Все эти действия можно производить с обычными десктопными приложениями. Кроме того, представленная оболочка работает в любом браузере (даже в IE8!).

Import/Export в Webix 3.0

Не секрет, что веб-приложения — самый активный сегмент в современной разработке ПО. Изначально это были лишь статические HTML страницы, которые со временем превратились в динамические приложения, по прежнему связанные с браузером и HTML-разметкой. Процесс развития продолжается прямо сейчас. Веб-приложения уже выходят за пределы браузера: с одной стороны, мы можем писать приложения для мобильных устройств и десктопа, используя веб-технологии, с другой стороны, веб-приложения получают все больше средств доступа к ресурсам устройств, на которых они работают.
Следуя этой тенденции, в Webix 3.0 мы добавили пару новых API, которые порядком упрощают обмен данными между веб-приложением и рабочей средой пользователя.

Как экспортировать данные из веб-приложения

Очень легко. С Webix 3.0 у вас есть две мощные команды для экспорта:

webix.toPNG($$("chart"))
webix.toExcel($$("datatable"));

export to png

Эти функции позволяют экспортировать Webix компонент в PNG или Excel файл. В случае экспорта в PNG вы можете использовать API не только с Webix компонентами, но и с любым HTML контентом.

// export the whole page to an image
webix.toPNG(document.body);

Работа с вложенными данными в Webix UI

Всем нравится пользоваться простыми приложениями с интуитивно понятным интерфейсом. Pецепт такого приложения прост: возьмите немного HTML-тегов, добавьте подходящий фреймворк, например, Bootstrap, и ваше приложение готово. В повседневной разработке все происходит немного по-другому. Бизнес-приложения работают со сложными данными, поэтому для их представления требуется более продвинутый интерфейс. Одним из таких кейсов является использование вложенных данных. Готового решения для отображения в HTML или Bootstrap пока нет. Но решить проблему можно с помощью Webix UI.

Tree

Простейший виджет, который можно использовать для отрисовки вложенных данных — это Tree. Этот элемент интерфейса, который довольно часто используется в десктопных приложениях, но редко встречается в веб-версиях. Webix Tree обладает полной функицональностью виджета tree. Он позволяет представлять иерархические данные в виде дерева, ветки которого можно развернуть или свернуть. Webix Tree работает быстро, отрисовывая тысячи элементов менее, чем за секунду. Если этого мало, можно использовать динамическую загрузку данных.

webix.ui({
view: "tree", data: nested_data
});

Webix-Tree

1 25 26 27 28 29 39