Tag Archives: ui

Responsive UIs in React Native

On the web it is – by now – obvious that you make your website responsive (*). Using a listener listening to the change event of the Dimensions API, it’s also possible to implement this kind of behaviour in React Native. import {Component} from "react"; import {Dimensions} from "react-native"; export default class LogDimensionChanges extends Component […]

React Native Parallax Scroll Header with Tabs

Nice writeup on how to create a typical screen where there’s a header image that fades out and disappears as you start scrolling. Essentially, everything but the header is put into a scrollview. In order to keep elements ‘fixed’ (i.e. the tab bar), I use the transform property with a translateY that is set to […]

Better Cross-Platform React Native Components

Good article by Nick Wientge on correctly creating Cross-Platform React Native Components: In this post we’ll look at some tools and techniques we can use to make our components look right at home on both iOS and Android — without sacrificing code reuse. The article revolves around building a button, but with respect for how each platform […]

NativeBase – Cross-Platform UI Components for React Native

NativeBase is UI component library for React Native, which comes with a great list of Components for easy use. The Components are constructed in pure React Native platform along with some JavaScript functionality with rich set of customisable properties. These components allow you to quickly build the perfect interface. NativeBase includes components such as anatomy […]

PanelKit, a UI framework enabling floating and pinned panels on iOS

Great stuff by Louis D’hauwe, a former student of mine: PanelKit is a UI framework that enables panels on iOS. A panel can be presented in the following ways: Modally As a popover Floating (drag the panel around) Pinned (either left or right) This framework does all the heavy lifting for dragging panels, pinning them […]

Date/Time Input Types coming to Firefox

Date/Time Input Types are coming to Firefox, and I must say they look quite good too (as a reference: here’s how Chrome implemented this): The implementation also looks familiar, doesn’t it? 😉 The date/timepickers are currently locked behind a flag in Nightly. Change dom.forms.datetime in about:config if you want to try them out already. Date/Time […]

Blueprint React UI Toolkit

Blueprint is a collection of React UI components, covering the majority of the common interface elements, patterns and interactions on the web. Using Blueprint ensures that you’ll end up with an elegant, easy-to-use UI, freeing you to focus on building your product—not the atomic pieces that comprise it. The UI components really are well written […]