Saturday, February 18, 2012

android: phone gap screen resolution

hmm... seems like 320x480 is quite safe for canvas size. 


Thursday, February 16, 2012

Android: PhoneGap

Follow instructions to install and set up
http://phonegap.com/start#android

to debug. need to open LogCat.
strange console.log() did not output here.
in the end, have to use Window > Show View > Other... > Android > LogCat (deprecated)

had problem connecting to device on debug mode. happen to find out Easy Tether is messing with USB debugging.

so refer to: http://stackoverflow.com/questions/4680637/mac-os-x-10-6-6-and-adb-devices-fails-to-list-android-devices


sudo kextunload /System/Library/Extensions/EasyTetherUSBEthernet.kext
sudo rm -rf /System/Library/Extensions/EasyTetherUSBEthernet.kext

working now.

using dreamweaver to edit the HTML and JS. test it in chrome before launching in emulator or device.






Wednesday, February 15, 2012

Android: navigation between screens

Each screen called "Activity"

create a new class that extends from "Activity"
create a new Android XML file to set up the layout

make sure that this new Activity is included in the AndroidManifest.xml.
in eclipse, open the AndroidManifest.xml > Application tab > Application nodes > Add... > Create a new element at top level > Activity.
Name: Browse > select new Activity class created

easier way is to edit the xml manually and add
<activity android:name="{name of new Activity subclass}"></activity>
in the <application> tag.

using Singleton design pattern, data can be passed to next screen.

For example:


public class Apple {
public static int number = 1;
double price = 0.5;
int size = 2;
String color = "red";
public static String name = "Apple";
public static Apple instance;
public void grow()
{
size++;
}
public String getColor()
{
return color;
}
}

in main Activity subclass:

Apple a = new Apple();
Apple.instance = a;

Apple.number++;
// et is editable text UI
Apple.name = et.getText().toString();
a.grow();


// go to next screen
Intent intent = new Intent(this, NextActivity.class);
startActivity(intent);

next Activity subclass:


public class NextActivity extends Activity implements View.OnClickListener{
Button b;
TextView tv;
@Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.next);
        tv = (TextView)this.findViewById(R.id.textView1);
        b = (Button) this.findViewById(R.id.button1);
        tv.setText("Hello, " + Apple.name + ", size: " + Apple.instance.size+ ". number of apple: " + Apple.number);
        b.setOnClickListener(this);
}


public void onClick(View v) {
// TODO Auto-generated method stub
// end this activity to go back to prev screen
this.finish();
}
}



Tuesday, February 14, 2012

Android: Hello World, XML, Java

Follow instructions to install Android SDK, Eclipse, ADT plugin
Set up AVD
Start new Android project

in res\layout\main.xml
open it to set up layout.
set id. strange why android makes programmer to add "@+id/" before the id. more memory load for the programmers.

main.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:orientation="vertical" >

    <TextView
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:text="Hello World" android:id="@+id/hello_txt"/>

    <EditText
        android:id="@+id/editText1"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content" android:text="123">

        <requestFocus />
    </EditText>

    <Button
        android:id="@+id/button1"
        android:layout_width="146dp"
        android:layout_height="wrap_content"
        android:text="Press me!" />

</LinearLayout>

HelloActivity.java

import android.app.Activity;
import android.os.Bundle;
import android.view.*;
import android.widget.*;

public class HelloActivity extends Activity implements View.OnClickListener{
TextView tv;
Button b;
EditText et;
    /** Called when the activity is first created. */
    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.main);
        tv = (TextView)this.findViewById(R.id.hello_txt);
        b = (Button) this.findViewById(R.id.button1);
        et = (EditText) this.findViewById(R.id.editText1);
        b.setOnClickListener(this);
    }
    // implement interface View.OnClickListener method
public void onClick(View v) {
// TODO Auto-generated method stub
tv.setText("Hello, " + et.getText());
}
}



Thursday, February 09, 2012

WP7: XML reading from RSS

WebClient client = new WebClient();
client.OpenReadCompleted += new OpenReadCompletedEventHandler(client_OpenReadCompleted);
client.OpenReadAsync(new Uri("http://www.todayonline.com/RSS/Todayonline", UriKind.Absolute));

void client_OpenReadCompleted(object sender, OpenReadCompletedEventArgs e)
{
    XmlReader reader = XmlReader.Create(e.Result);
    reader.ReadToFollowing("title");
    // assume there is a textbox named "textBox1"
    textBox1.Text = reader.ReadElementContentAsString() + "\n\n";
}

Windows 7 Mango Training - 8-9 Feb

Silverlight, C# in windows 7 phone
Summary of lessons learnt:
  1. same as WPF technology. XAML for layout of UI with CS controlling interactivity and behaviour of app. similar to Flex with MXML and AS 
  2. no Console.Writeline(), have to use System.Diagnostics.Debug.WriteLine()
  3. Loading and Activating events has 10 sec limit. if exceeded OS will terminate app
  4. Loading and Activating event is mutually exclusive
  5. NavigationService.Navigate(Uri) to move from one XAML page to another. eg.: NavigationService.Navigate(new Uri("/IntroPage.xaml", UriKind.RelativeOrAbsolute));
  6. Dormant and Tombstone states
  7. recall x:Name attribute for XAML elements for C# code integration and reference
  8. use Blend to create animation (new StoryBoard, record mode. use timeline) and use Visual Studio to call the animation for interactivity. make sure that XAML file is saved before switching to and fro the 2 tools. file can be overwritten if not careful. 
  9. Easing in blend for a animation segment is set at the end keyframe. eg.: if bounce easing is to be applied between frame 1 and 2, then easing is to be set in frame 2, instead of 1. unlike Flash.
  10. PNG image for App Icon
  11. use System.Windows.Threading.DisptacherTimer to perform timer functions instead of Timer due to access restriction of UI across threads
  12. To change default XAML for a app, change the WMAppManifest.xml in the project to reflect the xaml page in the DefaultTask element.
  13. Touch.FrameReported event (eg.: Touch.FrameReported += new TouchFrameEventHandler(Touch_FrameReported); ) to capture multitouch events on screen. but be careful of the reference point when getting the TouchPoint. Example: TouchPoint pt = e.GetTouchPoints(ContentPanel)[0]; // gets 1st touch with respect to UI Element named "ContentPanel"
  14. for network security access issues when debugging app, may have to run Visual Studio as administrator. right click on "Visual Studio ..." > "Run as administrator"
  15. personal preference: show line numbers. Tool > Options > check "Show all options" > Text Editor > All languages > Display > check "Line numbers"
  16. use WebClient for network HTTP communication
  17. System.Net.Socket supported