Happy New Year 2012, my friends!

Posted by Unknown Sabtu, 31 Desember 2011 0 komentar

Yeah, New Year 2012 has come! And I am pretty happy with this, because I can say honestly "2011 year, you were a nice time, full of great events, ideas and changes both in my personal and professional lives. Thank you for everything, take rest now".

So, 2012 year of the Dragon is here, and I am sure - it will be amazing and sooooo cool, as a dragon is! ;-)





Baca Selengkapnya ....

Adobe Flex: useful stuff for mobile development, part 2

Posted by Unknown Selasa, 13 Desember 2011 0 komentar
This is the second part of my post about Adobe Flex usage at mobile platforms.
In this post I want to show you several good sample projects of Adobe Flex usage on mobile platforms. All of them have source codes available for download. So if you're interested in cross-platform application creation with Adobe Flex this is a good way for a quick dive! ;)

Adobe engineers team has made a great progress with AIR runtime, and now Adobe Flex applications on mobile platforms (Android, iOS, etc.) show good performance and list of available features. At the same time, evangelists team has prepared a bunch of demo projects for popularizing of Adobe Flex as technology for cross-platform development.


Expense tracker application





The Expense Tracker Reference Application is a sample application created with Flex 4.6. It will introduce you to the major updates in the Flex 4.6 SDK, and demonstrate best practices for designing and developing a CRUD-based experience for mobile, tablet, and web platforms. The three Flex 4.6 Reference Applications use the ViewNavigatorApplication class as an application base for screen management, the ItemRenderer and LabeltItemRenderer/IconItemRenderer classes for list controls, and the MultiDPIBitmapSource and RuntimeDPI providers as means to manage different DPIs on different devices.
More info and source code:


Shopping cart application























The Shopping Cart Reference Application is a sample application created with Flex 4.5. It will introduce you to the major updates in the Flex 4.5 SDK, and demonstrate best practices for designing and developing a shopping experience for both mobile and web platforms. The three Flex 4.5 Reference Applications use the ViewNavigatorApplication class as an application base for screen management, the ItemRenderer and LabeltItemRenderer/IconItemRenderer classes for list controls, and the MultiDPIBitmapSource and RuntimeDPI providers as means to manage different DPIs on different devices.
More info and source code:
http://www.adobe.com/devnet/flex/samples/shopping-cart-application.html


Sales dashboard application























The Sales Dashboard Reference Application is a sample application created with Flex 4.6. It will introduce you to the major updates in the Flex 4.6 SDK, and demonstrate best practices for designing and developing an enterprise sales dashboard experience for mobile, tablet, and web platforms. The three Flex 4.6 Reference Applications use the ViewNavigatorApplication class as an application base for screen management, the ItemRenderer and LabeltItemRenderer/IconItemRenderer classes for list controls, and the MultiDPIBitmapSource and RuntimeDPI providers as means to manage different DPIs on different devices.
More info and source code:
http://www.adobe.com/devnet/flex/samples/sales-dashboard-application.html


Sample application for tablet with latest Flex 4.6 components





















The Flex 4.6 SDK features used in the application are:
  • SplitViewNavigator with state handling (uses new properties to put the first view in a Callout when in portrait mode due to screen space)
  • New Callout component
  • New CalloutButton component
  • New SpinnerList component (and corresponding SpinnerListContainer)
  • New ToggleSwitch component
  • Dynamic Splash Screen
  • Soft Keyboard Type handling (showing the numeric soft keyboard for example)
More info and source code:
http://devgirl.org/2011/10/31/flex-mobile-development-building-tablet-apps-full-example-with-source-code/


Game of Flex for tablets























If you want to check the source code of the app, you’ll learn:
  • How to use the new SplitViewNavigator architecture (portrait and landscape layouts on tablet devices)
  • How to display HTML content inside a Flex app
  • How to access the camera to take pictures
  • How to use the BusyIndicator, ToggleSwitch and List components
  • How to enable multi-touch
  • How to manage your views
  • How to use the accelerometer
  • How to create custom AS3 item renderers for your lists
  • How to access the local SQLite database
  • How to use native extensions
  • How to set up the new DateSpinner component
  • How to display callout popups
  • How to set up the software keyboard to match your needs
  • How to declare spinner lists
More info and source code:
http://www.riagora.com/2011/12/game-of-flex-on-tablets/



Blue Chips application





















The application demonstrates extensive usage of chart components and new Flex 4.6 components that target tablet development.
Description and video:
http://www.riaspace.com/2011/12/flex-4-6-bluechips-demo/
Source code:
https://github.com/pwalczyszyn/BlueChips


When you will start creation of your own mobile application with Adobe Flex, don't forget about performance optimization. It's quite important to provide responsive user interface with seamless interaction.
There is an article that will be quite useful for that purpose:
Flex mobile performance checklist

Have fun! :)


Baca Selengkapnya ....

Adobe Flex: useful stuff for mobile development, part 1

Posted by Unknown Sabtu, 10 Desember 2011 0 komentar
About one week ago Adobe released Flex SDK 4.6 and Flash Builder 4.6. The main goal of these releases was mobile and especially tablet development. And in this post I want to share some stuff that will inspire and motivate you for mobile development with Adobe technologies.

As the official Adobe blog says, the Flex 4.6 release was built on the mobile capabilities introduced in Flex 4.5, enabling you to:
  • create tablet apps with multiple views and adaptive layouts
  • use new tablet focused UI components, including Callout, SpinnerList, and ToggleButton controls
  • add text inputs with OS-specific interfaces and interactions to your apps
  • package AIR runtime with your application
  • have better integration and usage of ActionScript Native Extensions
In my opinion one of the coolest features is Adobe AIR Captive runtime. Why? Because the ability to package AIR runtime with your application into one file (APK for Android, IPA for iOS, etc.) guarantees the ability to run Flash/Flex/AIR applications and games in proper runtime.

ActionScript Native Extentions is also a great feature. It's a bridge between your Flex mobile app and a native library that can extend the capabilities of the Flex SDK. You can find a list of native extensions such as Notifications, Vibration, Gyroscope API, etc. here:

Also Flex 4.6 contains several new Spark components which will be especially useful in the mobile development for tablet devices:

SplitViewNavigator
One of the most common uses of SplitViewNavigator is the creation of User Interface screen based on a design pattern known as Master/Detail. 























Callout and CalloutButton
The component extends SkinnablePopUpContainer, inherits its all functionality and provides a relatively positioned arrow. This fully skinnable component can contain any kind of content, from a group of components to entire Views.
Figure 2. A basic Callout.


SpinnerList and DateSpinner, that components look & feel are very similar to native iOS spinner components.
Figure 4. The SpinnerList component.

Figure 5. The DateSpinner control.


ToggleButton










Soft Keyboard Parameters
Soft Keyboard Parameters allows you to modify the look of your mobile/tablet soft keyboard to display the best layout for specific text input format: number, email, punctuation, url, contact or default. For example, if you have text input for ZIP code, you can write something like that:
<s:TextInput softKeyboardType="number"/>


In the second part of that article I will show you several examples of nice mobile and cross-platform applications built with Adobe Flex. Many of them are open sourced, so you will be able to investigate their code to improve your skills. See u! ;-)






Baca Selengkapnya ....

Noise around Adobe and Flash/Flex future

Posted by Unknown Sabtu, 03 Desember 2011 0 komentar
Hello fellows! After I a long vacation finally I am back now and ready for new challenges! :)

As you may know last weeks there were a lot of talks about Adobe's decision to stop Adobe Flash player development for mobile devices. Plus, Adobe announced intention to donate Flex framework to the community via Apache Software Foundation. So, Adobe Flex 4.6 is the last version that was developed by Adobe itself.

Many people cry that  Adobe kills Flash and Flex platform with that decision. But it's absolutely not true! In fact Adobe Flash player on mobile devices wasn't very good and most of the users didn't use it. So there is really nothing bad to stop development Flash Player for mobile devices.
What about Flex framework? Well, I am sure that Flex community (which is quite active and skilled) will be able to continue Flex framework development and enrich it with new cool features.
You can read more about community's initiative here: http://www.spoon.as/

Also, to prevent groundless panic and thoughts Adobe posted an article with answers on the most important questions about Flash, Flex future.
Some questions and answers:
- Is Adobe still committed to Flex?
- Yes. ...


- Is Adobe still committed to Flash Builder?
- Yes. ...

- Will Adobe continue to support customers using Flex?
- Yes. ...

- Isn’t Adobe just abandoning Flex SDK and putting it out to Apache to die?
- Absolutely not - ...

- What guarantees can Adobe make in relation to Flex applications continuing to run on Flash Player and Adobe AIR?
- Adobe will continue to support applications built with Flex, as well as all future versions of the SDK running in PC browsers with Adobe Flash Player and as mobile apps with Adobe AIR indefinitely on Apple iOS, Google Android and RIM BlackBerry Tablet OS.

You can find more and full answers here:
http://blogs.adobe.com/flex/2011/11/your-questions-about-flex.html

Baca Selengkapnya ....

Android 4.0 SDK is available now!

Posted by Unknown Rabu, 19 Oktober 2011 0 komentar
As we all know the next version of Android was publicly released on 19 October 2011!
It's Android 4.0 Ice Cream Sandwich!
Ice Cream Sandwich is designed for use with both phones and tablets. This will level the gap between 2.x and 3.x Android versions that we have now for phones and tablets respectively.



Android 4.0 new features:
  • Virtual buttons in the UI, instead of taking up a capacitive screen
  • Voice typing, capable of recognizing speech and converting it into text
  • Widgets in a new tab, listed in a similar list to apps
  • Easier-to-create folders, with a drag-and-drop style
  • A customizable launcher
  • In a new phone app, visual voicemail functionality that lets user speed up or slow down *voicemail messages
  • Pinch-to-zoom functionality in the calendar
  • Offline search, a two-line preview, and new action bar at the bottom of the Gmail app
  • Ability to swipe left or right to switch between Gmail conversations
  • Integrated screenshot capture (accomplished by holding Power and Volume-Down buttons)
  • Improved error correction on the keyboard
  • Ability to access apps directly from lock screen (similar to HTC Sense 3.x)
  • Improved copy and paste functionality
  • Better voice integration and continuous dictating capability
  • Face Unlock, a facial recognition service
  • New tabbed web browser, allowing up to 16 tabs
  • Automatic syncing of browser with user's Chrome bookmarks
  • Modern Roboto font
  • Data Usage section in settings that lets user set warnings when he reaches a certain amount of use and disable data when exceeding the limit
  • Ability to shut down apps that are using data in the background
  • Camera app: zero shutter lag, time lapse settings, zoom while recording
  • Built-in photo editor
  • New gallery layout, organized by location and person
  • Refreshed 'People' app with social network integration, status updates and hi-res images
  • Android Beam, a NFC feature that lets user exchange websites, contact info, directions, YouTube, etc.

Android 4.0 SDK already available for download! Blazing fast! ;-)
http://developer.android.com/sdk/android-4.0.html


Baca Selengkapnya ....

Android: XML parsing thoughts, part 2

Posted by Unknown Senin, 17 Oktober 2011 0 komentar
This is the second part of the article about XML parsing. The first part of it is available here.

In this post I want to tell you about one 3rd party XML handling lib that you may want to use in Android development.

It's Simple framework. Simple is a high performance XML serialization and configuration framework originally from Java world. But it can be used in Android too. It offers full object serialization and deserialization, maintaining each reference encountered.
So, what is the feature of Simple? Simple framework uses annotations to describe correspondence between Java objects and their XML representation in a declarative manner. As a result we have very demonstrable Java code without weird boilerplate stuff! :)







To use Simple in your Android project just add .jar file as a library (Project properties -> Java Build Path -> Libraries tab). Now you are ready! For example we need to parse XML like this:
<ninja>
<name>Katakuna</name>
<weapon type="melee">sword</weapon>
</ninja>

 No problems, it's easy! Just create Java class that describes ninja:
@Root(name="ninja")
public class Ninja
{
@Element(name="name")
public String name;
 
@Element(name="weapon")
public String weapon;
 
@Attribute(name="type")
public String weaponType;
}
Looks very demonstrable, isn't it? ;)

Finally deserialization is pretty simple:
Reader reader = new StringReader(xmlStream);
Persister serializer = new Persister();
try
{
Ninja ninja = serializer.read(Ninja.class, reader, false);
}
catch (Exception e)
{
Log.e("XML with Simple demo", e.getMessage());
}
I think this small example has intrigued you with Simple framework! You can learn more about Simple framework features (which are so cool!) at tutorials and articles pages. Download it here (it's free and licensed under Apache license).

Baca Selengkapnya ....

Android: XML parsing thoughts, part 1

Posted by Unknown Minggu, 09 Oktober 2011 0 komentar
Today I want to share my thoughts about XML parsing on Android. It's true, that XML parsing is one of the most frequent task in Android development - a lot of web-services have their data responses in XML format.
So, what do we have in Android to parse XML data?
Out of the box we have DOM, SAX and XMLPull parsers. 
DOM (Document Object Model) parser is the well-known (especially for web developers) parser and in fact it worse then SAX and PULL: it's slower and has awful and verbose (in my opinion) usage syntax.
Just a short example (part of the RSS parser):

try {
            DocumentBuilder builder = factory.newDocumentBuilder();
Document dom = builder.parse(this.getInputStream());
Element root = dom.getDocumentElement();
NodeList items = root.getElementsByTagName(ITEM);
            for (int i = 0; i < items.getLength(); i++){
Message message = new Message();
Node item = items.item(i);
NodeList properties = item.getChildNodes();
                for (int j = 0; j < properties.getLength(); j++){
Node property = properties.item(j);
String name = property.getNodeName();
                    if (name.equalsIgnoreCase(TITLE)){
message.setTitle(property.getFirstChild().getNodeValue());
} else if (name.equalsIgnoreCase(LINK)){
message.setLink(property.getFirstChild().getNodeValue());
} else if (name.equalsIgnoreCase(DESCRIPTION)){
StringBuilder text = new StringBuilder();
NodeList chars = property.getChildNodes();
                        for (int k = 0; k < chars.getLength(); k++){
text.append(chars.item(k).getNodeValue());
}
                        message.setDescription(text.toString());
} else if (name.equalsIgnoreCase(PUB_DATE)){
message.setDate(property.getFirstChild().getNodeValue());
}
}
                messages.add(message);
}
} catch (Exception e) {
// place any execption handling code here
}
As you can see, the structure of this code is not so simple as you can expect for parsing such simple XML as RSS data. In real live you can have more complex XML structure and then DOM parser code will have a lot of weird if/else constructions that turns entire code into mess!
So, let's forget about DOM parser and move to the better alternatives! ;-)

XML Pull Parser is an interface that defines parsing functionality provided in XMLPULL V1 API.
It's faster than DOM and has lower memory usage.
The same example code of the RSS parsing:
try {
parser.setInput(this.getInputStream(), null);
int eventType = parser.getEventType();
Message currentMessage = null;
boolean done = false;
while (eventType != XmlPullParser.END_DOCUMENT && !done){
String name = null;
switch (eventType){
case XmlPullParser.START_DOCUMENT:
messages = new ArrayList<Message>();
break;
case XmlPullParser.START_TAG:
name = parser.getName();
if (name.equalsIgnoreCase(ITEM)){
currentMessage = new Message();
} else if (currentMessage != null){
if (name.equalsIgnoreCase(LINK)){
currentMessage.setLink(parser.nextText());
} else if (name.equalsIgnoreCase(DESCRIPTION)){
currentMessage.setDescription(parser.nextText());
} else if (name.equalsIgnoreCase(PUB_DATE)){
currentMessage.setDate(parser.nextText());
} else if (name.equalsIgnoreCase(TITLE)){
currentMessage.setTitle(parser.nextText());
}
}
break;
case XmlPullParser.END_TAG:
name = parser.getName();
if (name.equalsIgnoreCase(ITEM) &&
currentMessage != null){
messages.add(currentMessage);
} else if (name.equalsIgnoreCase(CHANNEL)){
done = true;
}
break;
}
eventType = parser.next();
}
} catch (Exception e) {
             // place any execption handling code here
}
While it's better than the DOM parser, still it has boilerplate if/else statements which can turn complex XML data parser code into mess. 

Finally, there is a SAX parser. SAX is an event-based sequential access parser API. SAX provides a mechanism for reading data from an XML document which is an alternative to the one provided by the Document Object Model (DOM). Big advantage of SAX is a lower memory consumption: SAX parsers operate on each piece of the XML document sequentially, while the DOM  parser operates on the document as a whole.
Android SDK has two build-in SAX parsers implementation. And one of them (from android.sax package) is pretty good: it's faster than DOM, has better usage syntax (still verbose) and (it's main advantage!) it's really easy to define an XML structure with it.
The same sample of the RSS parser could look like this:

public void parse(BufferedReader in) {
RootElement root = new RootElement(ITEM)
;
root.setStartElementListener(new StartElementListener() {
public void start(Attributes attributes) {
            currentMessage = new Message();
}
});
root.setEndElementListener(new EndElementListener() {
public void end() {
result.add(currentItem);
	}
});
 
root.getChild(TITLE).setEndTextElementListener(new EndTextElementListener() {
public void end(String body) {
  currentMessage.title = body;
      }
});
 
root.getChild(LINK).setEndTextElementListener(new EndTextElementListener() {
public void end(String body) {
currentMessage.link = body;
}
});
 
root.getChild(DESCRIPTION).setEndTextElementListener(new EndTextElementListener(){
public void end(String body) {
currentMessage.description = body;
}
});
 
root.getChild(PUB_DATE).setEndTextElementListener(new EndTextElementListener() {
  public void end(String body) {
            currentMessage.publicationDate = body;
      }
});
 
try {
  Xml.parse(in, root.getContentHandler());
      } catch (Exception e) {
             // place any execption handling code here
}
}
While SAX parser code has a little bit more lines (mainly due to curly brackets and parenthesis), this code is more readable and can be extended to handle complex XML data easily! For example, imagine that we have title publication date node with nested nodes:

Element linkNode = root.getChild(LINK);
linkNode.getChild(LINK_CHILD_1).setEndTextElementListener(
new EndTextElementListener() {
public void end(String body) {
currentItem.linkChild1 = body;
}
});
linkNode.getChild(LINK_CHILD_2).setEndTextElementListener(
new EndTextElementListener() {
public void end(String body) {
currentItem.linkChild2 = body;
}
});
...

As you can see it's easy to define and handle any XML structure without chains of if/else statements.


So, android.sax parser is my favorite one for Android! :)


A few words about performance:
DOM is the slowest one. SAX is slightly faster than Pull.
Android XML parsers performance chart (lower is better):
For chart composing big thanks to Shane Conder.

p.s. To keep this article in a readable size I decided to split my post into two parts. Second part is coming soon. ;-)

Baca Selengkapnya ....

Android: easy trick to make beautiful background for you Android application

Posted by Unknown Rabu, 28 September 2011 0 komentar

Nice screen background, isn't it? :)
Today I will show you an easy Android design trick how to create very beautiful backgrounds for your Android applications in just 2 minutes!

For example, imagine that you have some simple form like this:
It's pretty boring, huh?

Now let's make this UI screen more attractive. ;-) What we can do with background? Yeah, we can set some fancy solid color or even gradient fill. But it doesn't change entire situation too much.

What is the solution? I recommend you to apply pattern fill for background. All you need is just an seamless pattern image and 1 minute for coding! :)

  1. Find any seamless pattern image that you like and put it into drawable folder (or in drawable-ldpi, drawable-mdpi, etc. folders if you have several images of the same pattern for different screens). 
  2. Create new XML file and put it into drawable folder: (e.g. drawable/background_pattern_fill.xml)

<?xml version="1.0" encoding="utf-8"?>
<bitmap xmlns:android="http://schemas.android.com/apk/res/android"
android:src="@drawable/background_pattern"
  android:tileMode="repeat">
</bitmap>

where is "background_pattern_image" is your favorite seamless pattern for custom background.
     3. Apply created custom background to any View component:
<LinearLayout
...
android:background="@drawable/background_pattern_fill"
...>


VoilĂ ! Now our UI screen looks much better! You can download the source code here.


More examples:




Baca Selengkapnya ....

Android: Pixel perfect user interfaces for Android applications

Posted by Unknown 0 komentar


We all know that User Interface is an extremely important part for every application that pretends to be attractive and popular among users. This is the axiom. Android mobile system is very popular and is installed on a big variety of devices: from low-tier cell phones (like HTC Hero) with small low density screens to high-tier phones (like Motorola Atrix, Samsung Galaxy S, etc.) and tablets with big high density screens. Moreover there are a lot of Android devices vendors - Samsung, HTC, Motorola, LG, Dell, etc. As a result we have so called "fragmentation" problem. 


Today I want to reveal one useful feature of ADT (Android Development Tools) plug-in for Eclipse. Do you think that it will be DDMS perspective? No, man! :) I think any Android developer (from novice to expert) should know and use DDMS perspective which is so useful and powerful.
But there is also one more nice ADT feature that will help us to create better User Interfaces!
This is a "Pixel Perfect" perspective. It can be accessed from the menu:
Windows - Open Perspective - Other - Pixel Perfect

The main goal of "Pixel Perfect" perspective is to provide easy way to review user interface of our application in details. There are several useful features: 
  • image of the screen that is currently visible on the emulator or device and 
  • magnified image of that screen.You can move the cross-hair to inspect every detail (including color values) of your screen to make pixel perfect user interface! :)
  • "Pixel Perfect Tree" - to inspect visual objects hierarchy 

  • "Load image overlay over the screen" - it's very useful for matching actual screen with the desired screen from a specification.


As you may see "Pixel Perfect" goal is similar with the Hierarchy Viewer tool (which is free standalone tool, available at android-sdk\tools\). Hierarchy Viewer tool has not only all features of the "Pixel Perfect" perspective, but also a lot of unique features: extended Tree Hierarchy view, visual indicators for measure/layout/draw performance, etc. But if you prefer doing all the stuff using IDE and you need just pixels and colors matching, then the "Pixel Perfect" ADT perspective is a good choice.

I want to believe that one day most of Android apps will be designed so well that even iOS users (who are so proud of iOS design) will be envious! ;-)


Baca Selengkapnya ....

Flex: image transformations to make realistic paper folding illusion

Posted by Unknown Selasa, 16 Agustus 2011 0 komentar
Today I want to show you a nice image manipulation trick that you can do in Flex. 
Imagine that you have image of some paper object (like envelope or flyer):

and you want to transform it a little bit to get a realistic look of the folded paper. Something like this:

I will show you how to do it! ;)


Solution...

1) Slice original image into several parts:
 
var imageData:BitmapData = Bitmap(image.content).bitmapData;  
var slicesData:Array = [];   
var sliceWidth:Number = imageData.width / numSlices; 
var sliceHeight:Number = imageData.height;

for (var i:int = 0; i < numSlices; i++)
{
   slicesData[i] = new BitmapData(sliceWidth, sliceHeight);
     slicesData[i].copyPixels(imageData, new Rectangle(i *
     sliceWidth, 0, sliceWidth, sliceHeight), new Point(0, 0));
}

2) Apply skew transofrmation for each even part, and apply the same scew but with the opposite direction for odd parts:
for (var i:int = 0; i < slices.length; i++)
{
    var skewMatrix:Matrix = new Matrix();
    if (i % 2)
        skewMatrix.b = skew;
    else
        skewMatrix.b = -skew;
    slices[i].transform.matrix = skewMatrix;
}


3) In real life there are light sources, so some parts of the object are lighter, while the other parts are darker (because of the shadow). So in order to make more realistic look we will extend step 2 with color transformations:

for (var i:int = 0; i < slices.length; i++)
{
    var skewMatrix:Matrix = new Matrix();
    // if even: skew and make it darker
    if (i % 2)
    {
        skewMatrix.b = skew;
        slices[i].transform.colorTransform = new ColorTransform    
        (shadowFactor, shadowFactor, shadowFactor, 1, 0, 0, 0, 0);
    }
    // if odd: skew and make it lighter
    else
    {
        skewMatrix.b = -skew;
        slices[i].transform.colorTransform = new ColorTransform    
        (lightFactor, lightFactor, lightFactor, 1, 0, 0, 0, 0);
    }

    slices[i].transform.matrix = skewMatrix;
}


4) Finally, just put all slices into one container with horizontal layout and horizontal gap = 0 and you will get a nice image of the folded paper! :)


We can get a lot of different combinations by playing with 4 main parameters: number of sliced, scew factor, light factor and shadow factor. 
Source code is available here.


Additional examples:









Baca Selengkapnya ....
Trik SEO Terbaru support Online Shop Baju Wanita - Original design by Bamz | Copyright of android illegal.