WEBIX BLOG

Сразу после релиза Webix 2.5 мы обновили наш онлайн инструмент для веб-разработки Webix Skin Builder. С последним обновлением он обзавелся встроенным Material скином, а также стал еще более удобным в использовании.

Для тех, кто еще не работал с Webix Skin Builder, мы расскажем о практической пользе этого полезного инструмента для создания дизайна. Он позволяет создавать кастомные скины для интерфейса веб-приложений, а также предоставляет набор скинов на ваш выбор.

Material Skin

Когда мы впервые анонсировали возможность использования Material Skin в приложении, написанном на Webix, этот скин еще не был включен в пакет библиотеки. Чтобы его скачать, нужно было перейти в специальный репозиторий на github.com. Теперь скин доступен прямо из нашего инструмента Skin Builder.

Webix Skin Builder также порадует вас улучшенным интерфейсом. Просто загляните на страницу приложения, чтобы убедиться, что теперь оно работает и выглядит еще лучше.

Мы рады сообщить вам о нашем небольшом, но весьма эффектном обновлении Webix — версия 2.5! Этот релиз принес следующие изменения: поддержка нового дефолтного браузера Windows 10 Microsoft Edge, улучшения существующих Kanban и Pivot виджетов, а также добавления новых функциональностей в компоненте Calendar. Конечно, как всегда новая версия включает в себя исправления багов и мелкие UI обновления.

Если у вас совсем нет времени на прочтение поста, вы можете скачать новую версию прямо сейчас по этой ссылке.

Поддержка Microsoft Edge

Итак, теперь все виджеты Webix отлично работают в новом браузере Microsoft Edge. Это значит, что приложения, созданные при помощи нашей библиотеки, будут поддерживать Edge на 100%

У нас отличные новости для вас! Библиотека Webix была обновлена до версии 2.4, в которую вошли такие улучшения, как новый виджет Portlet и контролы формы MultiCombo и RangeSlider. И это далеко не полный список всех изменений.

Виджет Portlet

Portlet— это layout компонент, с помощью которого вы можете интуитивно создавать макеты портала. Более того, портлеты легко менять местами путем перетаскивания в нужное место место вашей страницы.

Итак, вам не придется писать тонны кода для изменения расположения элементов на странице. Все, что вам нужно будет сделать — это потянуть портлет с встроенным виджетом за специальный хэндлер и переместить его на одно из возможных мест “посадки”, которые будут выделены цветом. Хотите посмотреть, как это работает? Вам поможет это демо.

Ace — это удобный JavaScript редактор кода. Он сочетает в себе функции и возможности таких популярных редакторов, как Sublime, Vim и TextMate. Cloud9 IDE использует Ace в качестве основного редактора. Кроме того, Ace является преемником проекта Mozilla Skywriter (Bespin).

Теперь Ace можно использовать с Webix.

Весна — время перемен и бесконечных возможностей! Этой весной новая версия Webix 2.3 тоже принесла множество полезных обновлений и новых функций.

Команда Webix усердно трудилась над созданием продвинутого функционала, а также отвечала на множество сообщений, поступающих из Webix сообщества. В версии 2.3 появились совершенно новые компоненты — Органограмма и Баркод, а также свеженький Material скин, поддержка TypeScript и другие полезные улучшения.

*Проект приостановлен.

Недавно наша компания XB Software Ltd. выпустила собственную CRM-систему, которая практически полностью создана на основе Webix. Данная система является незаменимым инструментом для компаний, которые занимаются продажей услуг или продуктов, и при этом хотят установить долгосрочные отношения со своими клиентами.

Webix CRM имеет дружественный интерфейс, созданный на основе Material Design скина. Более того, этот продукт позволяет хранить клиентскую базу любого размера. Система хранит историю взаимодействий с заказчиком (email-переписку, телефонные звонки и т.д.), а также позволяет группировать контакты по различным категориям.

Давайте подробнее рассмотрим многочисленные функции Webix CRM.

Библиотека Webix предлагает множество вариантов создания пользовательского интерфейса, при этом анимация используется минимально. Мы запросто можем это исправить. Давайте посмотрим, как можно добавить симпатичные анимационные эффекты для различных контролов Webix.

Carousel, MultiView, TabView

TabView — это один из тех двух компонентов библиотеки, которые имеют встроенную анимацию. Когда вы переключаетесь между табами, смена активного таба происходит с анимацией. Для ее настройки вы можете использовать свойство animate.

Code of demo

Библиотека Webix предлагает множество готовых виджетов. Но даже это разнообразие меркнет перед обилием различных библиотек, созданных Open Source сообществом. В этой статье я расскажу, как любую стороннюю библиотеку можно превратить в Webix виджет.

Konva.js

В качестве примера я буду использовать Javascript библиотеку Konva.

Материальный Дизайн— это визуальный язык, который был разработан компанией Google и быстрыми темпами набирает популярность в мобильной и веб-разработке. Он значительно повышает юзабилити интерфейсов приложений, делая их простыми и красивыми. Веб-приложения, имеющие такой дизайн, могут быть легко адаптированы под различные типы платформ и все виды устройств.

Команда Webix вдохновилась визуальным языком Google Material Design и использовала его спецификацию для создания нового скина.

Возможно, вы уже знаете, что внутри контрола DataTable могут быть не только текстовые данные, но и чекбоксы. Они используются как для отображения состояния данных, так и для редактирования.

Основные чекбоксы

Минимальный код для инициализации DataTable с чекбоксами выглядит следующим образом:

Результатом работы данного кода является симпатичный JavaScript grid, представленный на картинке ниже. Строка “{common.checkbox()}” в темплейте преобразуется в чекбокс контрол.

Демо