Not long ago, I introduced Foxhole for Starling, a library of user interface components built on the Starling Framework. Over the last couple of months, I’ve been working hard on Foxhole, and a ton of progress has been made on all fronts. Let’s look at a few noteworthy details.
First of all, if you’re just checking out Foxhole for the first time, or if you haven’t checked in on Foxhole’s progress in a while, take a look at Foxhole’s List of Features to see what you can do with the components right now. I think you’ll find that Foxhole is a pretty powerful library for building UI in apps and games using the awesome hardware acceleration available in recent versions of the Flash runtimes. Foxhole is light, extensible, and especially great for mobile. If you have experience with Adobe Flex or with Flash Pro’s AS3 components, you’ll feel right at home with Foxhole.
Daniel recently released Starling 1.2, and that means that Foxhole can start taking advantage of the new features in that version. I always try to keep Foxhole compatible with the current official release of Starling, and I’ve been anticipating some great updates in Foxhole’s internals to improve performance with Starling 1.2’s updates. Along with those enhancements, I also added support for custom text renderers. Previous versions of Foxhole supported bitmap fonts only, but now you can use a new renderer called TextFieldTextRenderer that creates a texture from a TextField to support embedded and device fonts in Foxhole components. You can even create your own custom text renderer, so the Text Layout Framework or something else based on Flash Text Engine could be used with Foxhole too.
I’ve been adding more and more tutorials to the Foxhole Wiki whenever I get a chance. Check out the updated Getting Started with Foxhole tutorial which now follows along with the source code for the Foxhole HelloWorld example. The ScreenNavigator component is an essential part of navigating between menus/screens in a mobile app or game, and its “How To” tutorial covers all of the important features. Finally, a detailed article explains the lifecycle and architecture of custom Foxhole components. More tutorials and articles to come.
Because Foxhole has been gaining so much interest, Daniel added a new Foxhole Sub-Forum over at the official Starling forums. If you ever need any help with the components, I visit the forums many times a day, and I will be happy to answer any questions that you have. A number of Starling users are becoming very experienced with Foxhole too. I look forward to meeting more of the community there. Come join us. There’s a lot of excitement brewing around Starling and Foxhole. It’s a breath of fresh air, for sure.
Very exciting things are on the horizon for Foxhole. I’m looking forward to sharing more with you soon.
why don’t you use the TextField that in starling,embedFonts in starling is so easy to use.I want to use embedFonts on the button,but i don’t know how to do.help me please.
Make sure that you’re using the
TextFieldTextRenderer, as explained here. Then setembedFontsat the same time that you set thetextFormat:button.defaultLabelProperties.textFormat = new TextFormat("Arial", 12, 0xffffff); button.defaultLabelProperties.embedFonts = true;It’s very kind of you.I use it in your HelloWorld project.It can work.Thank you.
[Embed(source='/../assets/images/fonts/MSYHBD.ttf', embedAsCFF='false', fontName='MSYHBD')] public static var Msyhbd:Class; this.font = new Msyhbd(); button.labelFactory = function():ITextRenderer{ return new TextFieldTextRenderer(); } this.button.defaultLabelProperties.textFormat = new TextFormat(font.fontName, 30, 0x000000); button.defaultLabelProperties.embedFonts = true;I use the embedFonts in the AzureTheme’s tabInitializer(),and use icon and your tabBar like that.
this._tabBar.dataProvider = new ListCollection( [ { label: "树", defaultIcon:new Image(this._iconAtlas.getTexture("Tree")) , action: BUILD_TREE} ]);But I can’t dispose the icon and the embedFont label.Can you tell me how to do?Thank you.
this._navigator.clearScreen();
this._tabBar.dispose();
Oh,I just added this ‘this._tabBar.removeChildren();’and It is ok.
But I have another question,I don’t know how to adjusted one of my buttons in width on the _tabBar.Can you tell me how to do?Thank you.
You don’t need to dispose them. The TabBar will dispose its children (the tabs) and then the children will dispose their children.
There isn’t a supported way to adjust the width of one specific button on a TabBar. You could probably call getChildAt() to get a specific tab after the TabBar validates and resize it. You may need to manually call invalidate() on the TabBar after you do that. Otherwise, it has no way to know that one of the tabs has been resized.
Thanks again.But I want to based the width of my _tabBar on the embedFont automatically.I thought the TabBar can do it.But it seems that I have to try your method.
Can you show me how can use the List do something like LayoutExplorer that used the ScrollContainer.Because when I added many my object that have many childen object in ScrollContainer,the screen changed so slowly.I am a newcomer to starling and foxhole.I couldn’t solve the problem three days.
Currently, tabs are always equal in size. There is no way to have tabs with different widths. I have created a feature request for this.
You can set the layout property on a List, just like with ScrollContainer. Where are you having trouble? I need more specific information.
I’m looking forward to the change of your TabBar
When I only replace the “ScrollContainer” with “List” at the TiledColumnsLayoutScreen.as in your LayoutExplorer project.The children button always overlap.where I was going wrong?
You don’t add children to a List. You pass it a ListCollection as a data provider.