WEBIX JAVASCRIPT LIBRARY BLOG

UI development best practices, front-end programming tips and news to speed up your Web development.

Follow us:

Write for us: learn about our guest posts guidelines.

Webix UI 1.9: Hotkeys for Controls and Other UI Improvements

We are glad to introduce the release of Webix UI 1.9, a JavaScript library for building fast desktop and mobile apps. The new version includes some UI improvements that speed up apps development as well as enhancements of the skins and some bug fixes.

Hotkeys for Controls

The hotkey functionality was initially included in the Webix API. But you could implement hotkeys for controls only by using custom functions.

With the new version of the library, you get the possibility to define hotkeys for controls (inputs, buttons) in one line of code. Pressing a hotkey is fully equal to clicking on the corresponding input/control. It will bring focus to the input and invoke all the attached click handlers.

hotkey for webix control

Developing a Basic Website Functionality with Webix and Struts

Introduction

Day by day the world is getting faster. News is being spread around the world within minutes while the search for information is reduced just to surfing the Internet. Nowadays developers don’t spend months or years on the implementation of new ideas, this process can take just a couple of days or maybe weeks. At the same time, the process of developing web apps and sites is going up to a new speed level.The tools of building websites are getting smarter and even easier to use.

Code generators, autocomplete, code analyzers, libraries and frameworks have settled down in the developers’ life. They let reduce the time of site development to the minimum. The Internet itself is developing together with these tools.

Not long ago sites have presented static data while their functionality has been rather minimal. Today sites are fully-functional applications which allow performing the actions that earlier have been available on desktop only. One of the tools for fast building of a web app’s interface for both mobile and desktop devices is Webix, a JavaScript UI widgets library.

Let’s consider an example of creating a site aimed for announcing future conferences on front-end development with the help of Webix and a Java-framework Struts 2. It will look as follows:

website made with webix and struts

Creating a Mobile App with PhoneGap and Webix

With the help of Webix you can create a web app which will work equally well on both desktop and mobile devices. However, it still remains only an HTML page. In order to create a native app, you need some other tools. One of such tools is PhoneGap.

PhoneGap is a free and open source framework that allows you to create mobile apps using standardized web APIs for the platforms you care about. Phohegap works on base of HTML5 and can be used to create native app for all major mobile systems – iOS, Android, Windows Phone and others.

webix and phonegap mobile app

In this tutorial we will describe the process of creating a simple native app by means of Webix and PhoneGap tools.
You can get the final code of the application from github.

Build Responsive Web Apps with Webix 1.8

Today Webix has been updated to the version 1.8 that brings some pleasant bonuses for our users. The new version includes UI improvements, bug fixes and a few techniques for building responsive apps.

Responsive web apps

Previously when you were developing Webix web apps for desktop you had a problem with adapting the same app for the mobile devices. These desktop web apps had screens too wide for mobile apps.

So in Webix 1.8 we’ve added 2 features that will make your web apps responsive and improve user experience on both desktop and mobile devices.

Let’s consider the responsive web app made with Webix to show you this functionality.

Here is the screenshot of desktop web app:

webix reponsive web app

1 2 3 4 5 6