We present the web-based version of our free GraphSlider app that is currently available for Android phones on the Android Market. The version given here runs in a standard browser window. The complete source code for the puzzle is provided… Read More

We present the web-based version of our free GraphSlider app that is currently available for Android phones on the Android Market. The version given here runs in a standard browser window. The complete source code for the puzzle is provided… Read More

We provide complete source code for our GraphSlider Android AIR app that you can download and install from the Android Market. We comment the code with special emphasis on saving the state of the game. The app contains 30 different… Read More

We provide complete source code for our GraphSlider Android AIR app that you can download and install from the Android Market. We comment the code with special emphasis on saving the state of the game. The app contains 30 different… Read More

The following example shows how you can set the background alpha on a Spark FormHeading control in Flex Hero by setting the backgroundAlpha style. <?xml version="1.0" encoding="utf-8"?> <!-- http://blog.flexexamples.com/2010/09/01/setting-the-background-alpha-on-a-spark-formheading-control-in-flex-hero/ --> <s:Application name="Spark_FormHeading_backgroundAlpha_test" xmlns:fx="http://ns.adobe.com/mxml/2009" xmlns:s="library://ns.adobe.com/flex/spark" xmlns:mx="library://ns.adobe.com/flex/mx"> <s:layout> <s:VerticalLayout horizontalAlign="center" verticalAlign="middle" />… Read More

Sometimes you need to pass values from components to skin, for example having a dynamic layout. Using Flex sdk 4 you can transfer values using content property of the hostComponent ({hostComponent.content}). I made a small example that use hostComponent.content, changing… Read More

The following example shows how you can set the header height on a Spark Panel container in Flex 4 by setting the height property on the Panel container’s titleDisplay skin part. <?xml version="1.0" encoding="utf-8"?> <!-- http://blog.flexexamples.com/2010/07/25/setting-the-header-height-on-a-spark-panel-container-in-flex-4/ --> <s:Application name="Spark_Panel_titleDisplay_height_test" xmlns:fx="http://ns.adobe.com/mxml/2009"… Read More

The following example shows how you can set the thumb offset (distance between the slider thumb and track) on an MX HSlider control in Flex by setting the thumbOffset style. <?xml version="1.0" encoding="utf-8"?> <!-- http://blog.flexexamples.com/2010/05/27/setting-the-thumb-offset-on-an-mx-hslider-control-in-flex/ --> <mx:Application name="MX_HSlider_thumbOffset_test" xmlns:mx="http://www.adobe.com/2006/mxml" layout="vertical"… Read More

The following example shows how you can use a Spark Button control as a thumb for the Spark HSlider control by setting the skinClass style on the thumb skin part in a custom Spark HSlider control skin. <?xml version="1.0" encoding="utf-8"?>… Read More

In a previous example, “Creating a custom track skin on a Spark HSlider control in Flex 4″, we saw how you could create a custom track skin on a Spark HSlider control in Flex 4 by setting a custom skin… Read More

The following example shows how you can create a custom track skin on a Spark HSlider control in Flex 4 by setting a custom skin class on the slider’s track skin part. <?xml version="1.0" encoding="utf-8"?> <!-- http://blog.flexexamples.com/2010/04/14/creating-a-custom-track-skin-on-a-spark-hslider-control-in-flex-4/ --> <s:Application name="Spark_HSlider_track_skinClass_test"… Read More

The following example shows how you can create a custom track highlight skin on an MX HSlider control in Flex 4 by setting the trackHighlightSkin style and the Boolean showTrackHighlight style. <?xml version="1.0" encoding="utf-8"?> <!-- http://blog.flexexamples.com/2010/04/14/creating-a-custom-track-highlight-skin-on-an-mx-hslider-control-in-flex-4/ --> <s:Application name="MX_HSlider_trackHighlightSkin_test" xmlns:fx="http://ns.adobe.com/mxml/2009"… Read More

The following example shows how you can set the track highlight accent color on an MX HSlider control in Flex 4 by setting the accentColor style using MXML, CSS, or ActionScript. <?xml version="1.0" encoding="utf-8"?> <!-- http://blog.flexexamples.com/2010/04/13/setting-the-accent-color-on-an-mx-hslider-control-in-flex-4/ --> <s:Application name="MX_HSlider_accentColor_test" xmlns:fx="http://ns.adobe.com/mxml/2009"… Read More

In a previous example, “Changing a slider control’s thumb skin”, we saw how you could customize a slider control (HSlider or VSlider) and use your own custom embedded image instead of the default triangle thumb skin. The following example shows… Read More

In this tutorial we will be mocking up and finishing a pan and throw class that will allow us to add this effect to any element we want. To accomplish this, we will create a image viewer – but not… Read More

The following example shows how you can toggle whether a user is allowed to click on a Spark HSlider control’s track in Flex 4 by setting the Boolean mouseEnabled property on the HSlider controls track skin part. <?xml version="1.0" encoding="utf-8"?>… Read More

The following example shows how you can set the thumb color on a Spark HSlider control in Flex 4 by listening for the change and valueCommit events and setting the chromeColor style on the thumb skin part. <?xml version="1.0" encoding="utf-8"?>… Read More