Feathers UI beta.6 preview build on Haxelib

Today, Feathers UI beta.6 is now officially available on Haxelib. This is the latest of multiple preview builds that are planned before the first stable release in early 2022. Since we're in the beta stage, the core framework architecture has settled down, and breaking changes are much less likely to happen going forward. Developers who don't mind a few rough edges here and there should consider Feathers UI ready for starting development on new projects!

Feathers UI is an open source framework of graphical user interface (GUI) components for creative, cross-platform projects. Using the Haxe programming language, Feathers UI is built on OpenFL, a user-friendly library for rendering, input, networking, and more. Deploy native apps to iOS, Android, Windows, macOS, Linux, and even publish your project to the web — all using the same Haxe codebase.

🚨 Please note that this is a beta version of Feathers UI. Some components and features may still be missing, and occasional bugs should be expected.

Feathers UI continues to achieve each new milestone thanks the very generous support from the contributors on Github Sponsors, and everyone who backed the successful 2019 Feathers UI Kickstarter campaign. A big, enthusastic thank you to you all!

What's new in beta.6?

Let's take a look at some of the new features that are included with Feathers UI beta.6.

New Transition Builders

A number of new animated transitions are now available for Feathers UI navigator components.

  • ColorFadeTransitionBuilder offers a classic "fade to black" sort of effect. Obviously, you can fade to any color that you prefer. It doesn't need to be black.

  • CoverTransitionBuilder "covers" the old view a new one by sliding in the new view on top.

  • FadeTransitionBuilder fades the new view in, fades the old view out, or cross-fades both views at the same time.

  • IrisTransitionBuilder animates the scale of a circular mask to replace the old view with the new view.

  • RevealTransitionBuilder is the opposite of CoverTransitionBuilder. It "reveals" the new view below the old view, by sliding the old view out of the way.

  • SlideTransitionBuilder "slides" both views in the same direction by translating their position, with the new view starting out of bounds and ending where the old view started.

  • WipeTransitionBuilder uses a retangular mask to "wipe" the old view away to reveal the new view below.

Want to see the transitions in action? Check out the new Transitions Story Explorer.

Each animated transition includes a number of configurable parameters, such as the duration in seconds, and the story explorer exposes controls for each transition so that you can play around with them.

New Features

This build also fixes several bugs, and it includes many new features too. Here's a few worth highlighting:

  • TreeView has a new toggleChildrenOf() method that allows you to programmatically open and close all children of a branch. It also now supports using the keyboard's left and right arrow keys to open and close branches interactively, like how native UI trees work on desktop operating systems.

  • Scrolling containers have a new scrollMode property that controls whether the internal implementation uses scrollRect or mask on its internal view port. This is an advanced property, and the difference will be subtle, but there may be times when one or the other works better. I wanted to make that choice available.

For complete details, check out the beta.6 CHANGELOG.

Install Feathers UI beta.6

Feathers UI beta.6 may be installed using the haxelib install command in your terminal.

haxelib install feathersui 1.0.0-beta.6

Be sure to take a look at the complete installation instructions for details about installing required dependencies, along with links to step-by-step tutorials for setting up supported editors and IDEs.

Documentation

Community

How to help the project

Want to help keep the lights on and servers running? Make a monthly (or one-time) contribution on Github Sponsors.

Questions or comments?

Everyone, I just want to say thank you again for your support. I'm looking forward to hearing what you think of the new Feathers UI so far. If you create anything with this build — even a simple prototype — I'd love it if you could share your experiences (and maybe even a screenshot 🖼!).

I've created an official beta.6 discussion thread in the community forums. Head over there to leave a comment!

Kickstarter Devlog Roundup: August 2021

Every three to four weeks, I've been posting updates on Kickstarter that summarize what I've been adding to the Haxe/OpenFL version of Feathers UI recently. To be sure that no one has missed any of these updates, I'm going to occasionally post a quick roundup here on the Feathers UI blog. Let's jump right in…

Every few months, I'll try to do another roundup of the Kickstarter updates here on the blog. However, if you'd like to see these updates sooner, subscribe to my Kickstarter Atom feed.

Feathers UI beta.5 preview build on Haxelib

Today, Feathers UI beta.5 is now officially available on Haxelib. This is the latest of multiple preview builds that are planned before the first stable release in early 2022. Since we're in the beta stage, the core framework architecture has settled down, and breaking changes are much less likely to happen going forward. Developers who don't mind a few rough edges here and there should consider Feathers UI ready for starting development on new projects!

Feathers UI is an open source framework of graphical user interface (GUI) components for creative, cross-platform projects. Using the Haxe programming language, Feathers UI is built on OpenFL — a user-friendly library for rendering, input, networking, and more. Deploy native apps to iOS, Android, Windows, macOS, Linux (and even publish your project to the web!) using the same Haxe codebase.

🚨 Please note that this is a beta version of Feathers UI. Some components and features may still be missing, and occasional bugs should be expected.

Feathers UI continues to achieve each new milestone thanks the very generous support from the contributors on Github Sponsors, and everyone who backed the successful 2019 Feathers UI Kickstarter campaign. A big, enthusastic thank you to you all!

What's new in beta.5?

Let's take a look at some of the new UI components and features that are included with Feathers UI beta.5.

New Layouts

  • TiledRowsLayout, TiledRowsListLayout, and PagedTiledRowsListLayout all position items as tiles (where all items have equal dimensions) in one or more rows. TiledRowsLayout is meant to be used with simple containers, like LayoutGroup and ScrollContainer. TiledRowsListLayout and PagedTiledRowsListLayout are meant to be used with data containers, like ListView. PagedTiledRowsListLayout will split tiles among multiple pages, if they don't all fit on one page.

  • The gap property of HorizontalLayout and VerticalLayout now accepts a value of Math.POSITIVE_INFINITY to indicate that it should try to add as much space as possible between items. If the container is resized, the gap will be adjusted to match. If the content is larger than the container, these layouts will fall back to the new minGap property.

    (By the way, the new tiled layouts also support Math.POSITIVE_INFINITY for their horizontalGap and verticalGap properties.)

New Features

This build also fixes a ton of bugs, and it includes many new features too. Here's a few worth highlighting:

  • Scrolling containers, like ListView and ScrollContainer, now support snapping to pages. These snap positions, which may be arbitrary values (not just pages), may be specified by layouts. For instance, the new PagedTiledRowsListLayout, mentioned above, returns either an array of x or y values, depending on whether the pages are oriented horizontally or vertically.

  • Layouts may now implement the new IKeyboardNavigationLayout interface, if they need to customize how selection in components like ListView changes when the keyboard arrow keys, page up/down keys, or home/end keys are pressed. This is used primarily by the new tiled layouts, but custom layouts will be able to use the same interface to customize their own behavior too, if they have interesting positioning algorithms.

  • LayoutGroup and scrolling containers like ListView, ScrollContainer, and Panel have a new maskSkin property. This mask will automatically resize when the container resizes. Scrolling containers also add a similar viewPortMaskSkin property to mask only the view port (which is the region containing scrollable content).

This list would be far too long if it included all of the bug fixes related item renderers, word wrap, data container selection, focus management, and more. For complete details, check out the beta.5 CHANGELOG.

Install Feathers UI beta.5

Feathers UI beta.5 may be installed using the haxelib install command in your terminal.

haxelib install feathersui 1.0.0-beta.5

Be sure to take a look at the complete installation instructions for details about installing required dependencies, along with links to step-by-step tutorials for setting up supported editors and IDEs.

Documentation

Community

How to help the project

Want to help keep the lights on and servers running? Make a monthly (or one-time) contribution on Github Sponsors.

Questions or comments?

Everyone, I just want to say thank you again for your support. I'm looking forward to hearing what you think of the new Feathers UI so far. If you create anything with this build — even a simple prototype — I'd love it if you could share your experiences (and maybe even a screenshot 🖼!).

I've created an official beta.5 discussion thread in the community forums. Head over there to leave a comment!

Feathers UI beta.4 preview build on Haxelib

Today, Feathers UI beta.4 is now officially available on Haxelib. This is the latest of multiple preview builds that are planned before the first stable release in early 2022. Since we're in the beta stage, the core framework architecture has settled down, and breaking changes are much less likely to happen going forward. Developers who don't mind a few rough edges here and there should consider Feathers UI ready for starting development on new projects!

Feathers UI is an open source framework of user interface components for creative, cross-platform projects. Using the Haxe programming language, Feathers UI is built on OpenFL — a user-friendly library for rendering, input, networking, and more. Deploy native apps to iOS, Android, Windows, macOS, Linux (and even publish your project to the web!) using the same Haxe codebase.

🚨 Please note that this is a beta version of Feathers UI. Some components and features may still be missing, and occasional bugs should be expected.

Feathers UI continues to achieve each new milestone thanks the very generous support from the contributors on Github Sponsors, and everyone who backed the successful 2019 Feathers UI Kickstarter campaign. A big, enthusastic thank you to you all!

What's new in beta.4?

Let's take a look at some of the new UI components and features that are included with Feathers UI beta.4.

New UI Components

  • NumericStepper displays editable numeric text with a set of buttons to increment and decrement the value.

New Features

This build also fixes a ton of bugs, and it includes many new features too. Here's a few worth highlighting:

  • ComboBox and PopUpListView both have a new prompt property to display some placeholder text when no item is currently selected.

    popUpListView.prompt = "Select an item";
    
  • GridView adds a new sortableColumns property, which updates the sort order when the user clicks a column header. Alternatively, developers may set new sortedColumn and sortOrder properties to change the sort order programatically. When a column is sorted, a visual indicator may be displayed to the user in the column header to indicate the order (ascending or descending).

  • GridView also adds optional new divider skins between columns and between column headers.

  • ItemRenderer can display an optional accessoryView on the far right side.

  • HorizontalLayoutData and VerticalLayoutData have new static helper functions named fill(), fillHorizontal(), and fillVertical(). These make it quick and easy to create layout data object with percentWidth and percentHeight values set to 100.0.

    component.layoutData = VerticalLayoutData.fillVertical();
    
  • TextInput and TextArea both have a new errorString property that displays a callout with the error message when focused, and displays a special border.

    textInput.errorString = "Something is wrong";
    

This list would be far too long if it included all of the bug fixes related focus management, scrolling, item renderer recycling, themes and styles, and more. For complete details, check out the beta.4 CHANGELOG.

Install Feathers UI beta.4

Feathers UI beta.4 may be installed using the haxelib install command in your terminal.

haxelib install feathersui 1.0.0-beta.4

Be sure to take a look at the complete installation instructions for details about installing required dependencies, along with links to step-by-step tutorials for setting up supported editors and IDEs.

Documentation

Community

Questions or comments?

Everyone, I just want to say thank you again for your support. I'm looking forward to hearing what you think of the new Feathers UI so far. If you create anything with this build — even a simple prototype — I'd love it if you could share your experiences (and maybe even a screenshot 🖼!).

I've created an official beta.4 discussion thread in the community forums. Head over there to leave a comment!

Kickstarter Devlog Roundup: April 2021

Every three to four weeks, I've been posting updates on Kickstarter that summarize what I've been adding to the Haxe/OpenFL version of Feathers UI recently. To be sure that no one has missed any of these updates, I'm going to occasionally post a quick roundup here on the Feathers UI blog. Let's jump right in…

Every few months, I'll try to do another roundup of the Kickstarter updates here on the blog. However, if you'd like to see these updates sooner, subscribe to my Kickstarter Atom feed.

Feathers UI beta.3 preview build on Haxelib

Today, Feathers UI beta.3 is now officially available on Haxelib. This is the latest of multiple preview builds that are planned before the first stable release in early 2022. Since we're in the beta stage, the core framework architecture has settled down, and breaking changes are much less likely to happen. Developers who don't mind a few rough edges here and there should consider Feathers UI ready for starting development on new projects!

Feathers UI is an open source framework of user interface components for creative, cross-platform projects. Using the Haxe programming language, Feathers UI is built on OpenFL — a user-friendly library for rendering, input, networking, and more. Deploy native apps to iOS, Android, Windows, macOS, Linux (and even publish your project to the web!) using the same Haxe codebase.

🚨 Please note that this is a beta version of Feathers UI. Some components and features may still be missing, and occasional bugs should be expected.

Feathers UI has reached this milestone thanks the very generous support of all of the backers from the Feathers UI Kickstarter campaign, which completed successfully in the summer of 2019. A big, enthusastic thank you to everyone who has supported the project, whether you are a backer, shared the Kickstarter with your friends on social media, or simply encouraged me (Josh) to keep up the good work!

What's new in beta.3?

Let's take a look at some of the new UI components and features that are included with Feathers UI beta.3

New UI Components

  • Alert displays a message in a modal pop-up dialog with a title and a set of buttons.

  • ButtonBar displays a grouping of buttons based on a data collection.

  • Form and FormItem display a set of form controls with labels, including the ability to assign a specific submit button.

  • Header display a title in the center and two optional views on the left and right sides.

A big release

This build also includes a ton of minor improvements. Here's a few worth highlighting:

For complete details, check out the beta.3 CHANGELOG.

Install Feathers UI beta.3

Feathers UI may be installed using the haxelib install command in your terminal.

haxelib install feathersui

If you already have the library installed, and you simply want the latest version, run the haxelib update command instead.

haxelib update feathersui

Be sure to take a look at the complete installation instructions for details about installing required dependencies, along with links to step-by-step tutorials for setting up supported editors and IDEs.

Documentation

Community

Questions or comments?

Everyone, I just want to say thank you again for your support. I'm looking forward to hearing what you think of the new Feathers UI so far. If you create anything with this build — even a simple prototype — I'd love it if you could share your experiences (and maybe even a screenshot 🖼!).

I've created an official beta.3 discussion thread in the community forums. Head over there to leave a comment!

Support Feathers UI on Github Sponsors

From time to time, people ask how they can send a little thank you donation to the Feathers UI open source project. Feathers UI is a cross-platform GUI framework for building mobile, desktop, and web apps (native and GPU-accelerated).

Starting today, the best way to help out is to sponsor Josh Tynjala on Github. Not only will you help fund Feathers UI development, but you'll also get some perks in exchange. Depending on your budget, you could get special forum avatar badges, priority support, your logo on feathersui.com, and more. Whether you're an indie developer or a big company, there are various levels of sponsorship for everyone. Check it out!

Additionally, Josh Tynjala is eligible for the Github Sponsors Matching Fund, which means that for every dollar you send, Github will double it. So if you sign up for $10 monthly, Josh will get $20. Not bad, right?

Thank you so much for your generous support, and of course, for continuing to build your projects using Feathers UI. This community is truly inspiring.

→ Sponsor Josh Tynjala's Feathers UI development on Github

Feathers UI beta.2 preview build on Haxelib

Today, Feathers UI beta.2 is now officially available on Haxelib. This is the latest of multiple preview builds that are planned before the first stable release in early 2022. We've now made it past the alpha stage, which means that the core framework architecture has settled down, and breaking changes are much less likely to happen. Developers who don't mind a few rough edges here and there should consider Feathers UI ready for starting development on new projects!

Feathers UI is an open source framework of user interface components for creative, cross-platform projects. Using the Haxe programming language, Feathers UI is built on OpenFL — a user-friendly library for rendering, input, networking, and more. Deploy native apps to iOS, Android, Windows, macOS, Linux (and even publish your project to the web!) using the same Haxe codebase.

🚨 Please note that this is a beta version of Feathers UI. Some components and features may still be missing, and occasional bugs should be expected.

Feathers UI has reached this milestone thanks the very generous support of all of the backers from the Feathers UI Kickstarter campaign, which completed successfully in the summer of 2019. A big, enthusastic thank you to everyone who has supported the project, whether you are a backer, shared the Kickstarter with your friends on social media, or simply encouraged me (Josh) to keep up the good work!

What's new in beta.2?

Let's take a look at some of the new features that are included with Feathers UI beta.2.

Restored support for OpenFL 8.9

The previous beta.1 build was unintentionally released containing some incompatibilties with OpenFL 8.9. This was a mistake. Obviously, not everyone is ready to upgrade to OpenFL 9 yet. To ensure that this doesn't happen again, the CI server now builds using OpenFL 8.9 so that any new incompatible changes can be caught immediately.

ToolTipManager

In desktop apps, a tool tip may be added to a UI component so that a helpful description is displayed when the mouse hovers over it. Now, all Feathers UI components have a toolTip property that accepts a string value.

var button = new Button();
button.text = "Click Me";
button.toolTip = "If you click me, you'll win a prize!";
addChild(button);

The Application component enables the ToolTipManager automatically, but it may be disabled with <haxdef name="disable_tool_tip_manager"> in your project.xml file. If your root class isn't an Application, you may manually call ToolTipManager.addRoot() to enable tool tips.

As with all "managers" in Feathers UI, there is an IToolTipManager interface that may be used to implement a custom tool-tip manager, if the default one does not completely meet your needs.

Multiple item renderers

The ListView, GridView, and TreeView components have been updated to support displaying multiple types of item renderers for the same data collection.

The following example uses custom item renderers for the first and last items displayed by the ListView:

var regularItemRecycler = DisplayObjectRecycler.withClass(ItemRenderer);
var firstItemRecycler = DisplayObjectRecycler.withClass(CustomFirstItemRenderer);
var lastItemRecycler = DisplayObjectRecycler.withClass(CustomLastItemRenderer);

var listView = new ListView();
listView.itemRendererRecycler = regularItemRecycler;
listView.setItemRendererRecycler("first-item", firstItemRecycler);
listView.setItemRendererRecycler("last-item", lastItemRecycler);

listView.itemRendererRecyclerIDFunction = function(state:ListViewItemState):String {
  if(state.index == 0) {
    return "first-item";
  }
  if(state.index == listView.dataProvider.length - 1) {
    return "last-item";
  }
  // return null to use the default itemRendererRecycler
  return null;
};

For complete details about what else is included in this build, check out the beta.2 CHANGELOG.

Install Feathers UI beta.2

Feathers UI may be installed using the haxelib install command in your terminal.

haxelib install feathersui

If you already have the library installed, and you simply want the latest version, run the haxelib update command instead.

haxelib update feathersui

Be sure to take a look at the complete installation instructions for details about installing required dependencies, along with links to step-by-step tutorials for setting up supported editors and IDEs.

Documentation

Community

Questions or comments?

Everyone, I just want to say thank you again for your support. I'm looking forward to hearing what you think of the new Feathers UI so far. If you create anything with this build — even a simple prototype — I'd love it if you could share your experiences (and maybe even a screenshot 🖼!).

I've created an official beta.2 discussion thread in the community forums. Head over there to leave a comment!

Feathers UI beta.1 preview build on Haxelib

Today, Feathers UI beta.1 is now officially available on Haxelib. This is the latest of multiple preview builds that are planned before the first stable release in early 2022. We've now made it past the alpha stage, which means that the core framework architecture has settled down, and breaking changes are much less likely to happen. Developers who don't mind a few rough edges here and there should consider Feathers UI ready for starting development on new projects!

Feathers UI is an open source framework of user interface components for creative, cross-platform projects. Using the Haxe programming language, Feathers UI is built on OpenFL — a user-friendly library for rendering, input, networking, and more. Deploy native apps to iOS, Android, Windows, macOS, Linux (and even publish your project to the web!) using the same Haxe codebase.

🚨 Please note that this is a beta version of Feathers UI. Some components and features may still be missing, and occasional bugs should be expected.

Feathers UI has reached this milestone thanks the very generous support of all of the backers from the Feathers UI Kickstarter campaign, which completed successfully in the summer of 2019. A big, enthusastic thank you to everyone who has supported the project, whether you are a backer, shared the Kickstarter with your friends on social media, or simply encouraged me (Josh) to keep up the good work!

What's new in beta.1?

Let's take a look at some of the new UI components and features that are included with Feathers UI beta.1.

New UI Components

  • Drawer is a container that adds a special drawer that slides in and out, above all other content. It may be opened or closed with a swipe gesture from one of the four edges. (Live Demo)

  • HDividedBox and VDividedBox are containers display dividers between each of their children, and the dividers may be dragged to resize the children. (Live Demo 1 and Live Demo 2)

  • LayoutGroupItemRenderer is a base class for creating custom item renderers to display in data containers, such as ListView and GridView. This class allows item renderers with any number of children added to a layout (like LayoutGroup), and it also supports skinning based on mouse/touch states (like ItemRenderer).

New Samples

This build includes three new samples that demonstrate how to create custom skins for Feathers UI components.

The custom-programmatic-skin sample demonstrates how to create a custom skin with your own drawing commands. Source Code on Github

The custom-programmatic-skin-with-states sample creates a custom skin for a Button component that changes appearance when the button's state changes. Source Code on Github

The animated-tween-skin sample creates a custom skin that triggers animations based on mouse/touch events. Source Code on Github

A big release

This build also includes a ton of minor improvements. Here's a few worth highlighting:

For complete details, check out the beta.1 CHANGELOG.

Install Feathers UI beta.1

Feathers UI may be installed using the haxelib install command in your terminal.

haxelib install feathersui

If you already have the library installed, and you simply want the latest version, run the haxelib update command instead.

haxelib update feathersui

Be sure to take a look at the complete installation instructions for details about installing required dependencies, along with links to step-by-step tutorials for setting up supported editors and IDEs.

Documentation

Community

Questions or comments?

Everyone, I just want to say thank you again for your support. I'm looking forward to hearing what you think of the new Feathers UI so far. If you create anything with this build — even a simple prototype — I'd love it if you could share your experiences (and maybe even a screenshot 🖼!).

I've created an official beta.1 discussion thread in the community forums. Head over there to leave a comment!

Feathers UI alpha.3 preview build on Haxelib

Today, Feathers UI alpha.3 is now officially available on Haxelib. This is the third of multiple preview builds that are planned for 2020. These preview builds are intended to give the community an opportunity to see how development of Feathers UI is progressing — and to give everyone a chance to start prototyping some cool, new projects!

Feathers UI is an open source framework of user interface components for creative, cross-platform projects. Using the Haxe programming language, Feathers UI is built on OpenFL — a user-friendly library for rendering, input, networking, and more. Deploy native apps to iOS, Android, Windows, macOS, Linux (and even publish your project to the web!) using the same Haxe codebase.

🚨 Please note that this version of Feathers UI is considered to be alpha quality. Many of the planned UI components and features are still missing, and some APIs are likely to change in future builds. Use in production is not yet recommended.

Feathers UI has reached this milestone thanks the very generous support of all of the backers from the Feathers UI Kickstarter campaign, which completed successfully in the summer of 2019. A big, enthusastic thank you to everyone who has supported the project, whether you are a backer, shared the Kickstarter with your friends on social media, or simply encouraged me (Josh) to keep up the good work!

What's new in alpha.3?

Let's take a look at some of the new UI components and features that are included with Feathers UI alpha.3.

New UI Components

Stability improvements

As you can see above, this release doesn't include a lot of new components or major new features. The core focus this time around was around improving stability and fixing bugs. There are community projects that want to use Feathers UI in production, but alpha.2 wasn't quite ready for that yet.

With alpha.3, things are really coming together — with critical stability improvements to ListView, TreeView, TextInput, TextArea, programmatic skinning, and scrolling behavior.

One project that is starting to adopt Feathers UI is Moonshine IDE. I've been working closely with the team to migrate a number of dialogs and views in the app from Apache Flex (and ActionScript 3) to Feathers UI (and Haxe). This collaboration with the Moonshine IDE team is what drove many of the stability improvements in alpha.3, and it really made a big difference.

The goal with Moonshine IDE is to eventually replace the entire codebase with Haxe and compile it as a native app. In the meantime, it's likely that you'll soon see a release of Moonshine IDE that runs a mix of both Flex and Feathers UI side-by-side inside the existing Adobe AIR app. As a migration path for legacy Flex apps, it's really nice that Feathers UI makes it possible to do things incrementally instead of requiring a complete rewrite that's all-or-nothing.

As development continues in Moonshine IDE and other projects that are starting to adopt Feathers UI, you can expect future update to bring even more important bug fixes, performance boosts, and other improvements to stability.

Install Feathers UI alpha.3

Feathers UI may be installed using the haxelib command in your terminal.

haxelib install feathersui

Be sure to take a look at the complete installation instructions for details about installing required dependencies, along with links to step-by-step tutorials for setting up supported editors and IDEs.

Documentation

Community

Questions or comments?

Everyone, I just want to say thank you again for your support. I'm looking forward to hearing what you think of the new Feathers UI so far. If you create anything with this build — even a simple prototype — I'd love it if you could share your experiences (and maybe even a screenshot 🖼!).

I've created an official alpha.3 discussion thread in the community forums. Head over there to leave a comment!