Selasa, 07 Oktober 2014

Membuat aplikasi android pertama "Kalkulator"

Helo guys, kali ini saya akan sharing bagaimana membuat aplikasi pertama android. Pertama yang kita butuhkan adalah software, yaitu :

  • Eclipse + ADT plugin
  • Android SDK Tools
  • Android Platform-tools
  • A version of the Android platform
  • A version of the Android system image for the emulator
Dan sudah sepaket lengkap di link berikut ini Download

Kita akan membuat seperti :





1. Buat new android application project :


2. Kemudian beri nama "myapp" :


3. Klik next, next, next, dan uncheck "Create Activity" kemudian finish.
4. Susunan project :


5. Lalu, klik kanan di src, New => Package => Ketikkan dikolom 'name' yaitu : com.example.myapp lalu klik finish.
6. Setelah itu, klik kanan di package 'com.example.myapp', New => Class => Ketikkan di kolom 'Name' yaitu : MainActivity klik finish.

package com.example.myapp;

import android.app.Activity;
import android.os.Bundle;
import android.view.View;
import android.view.View.OnClickListener;
import android.widget.ArrayAdapter;
import android.widget.Button;
import android.widget.EditText;
import android.widget.Spinner;
import android.widget.TextView;

public class MainActivity extends Activity {
 

   public EditText angka1, angka2;
   public TextView total;
   public String num1, num2;
   public Double hasil;
   public Spinner spinner;
   public Button btnsubmit;
   
 @Override
 protected void onCreate(Bundle savedInstanceState) {
  super.onCreate(savedInstanceState);
  setContentView(R.layout.main_layout);

  spinner = (Spinner) findViewById(R.id.dropdownmenu);
  
  ArrayAdapter adapter = ArrayAdapter.createFromResource(this,
          R.array.hitung, android.R.layout.simple_spinner_item);
  adapter.setDropDownViewResource(android.R.layout.simple_spinner_dropdown_item);
  spinner.setAdapter(adapter);
  
  angka1 = (EditText) findViewById(R.id.angka1);
  angka2 = (EditText) findViewById(R.id.angka2);
  total = (TextView) findViewById(R.id.total);
  btnsubmit = (Button) findViewById(R.id.submit);
  
  btnsubmit.setOnClickListener(new OnClickListener() {

   public void onClick(View v) {
    
    String aksi = String.valueOf(spinner.getSelectedItem());
    num1 = angka1.getText().toString();
    num2 = angka2.getText().toString();
    
    double na1 = num1.length() > 0 ? Double.valueOf(num1) : 0;
             double na2 = num2.length() > 0 ? Double.valueOf(num2) : 0;

    if (aksi.equals("tambah")) {
     
     hasil = na1 + na2;
     
    } else if(aksi.equals("kurang")) {

     hasil = na1 - na2;
     
    } else if(aksi.equals("bagi")) {

     hasil = na1 / na2;
     
    } else {

     hasil = na1 * na2;

    }
    
    total.setText("Hasilnya " + Double.toString(hasil));

    
    /*Toast.makeText(MainActivity.this, 
      "OnItemSelectedListener : " + aksi,
      Toast.LENGTH_SHORT).show();*/
       
      }
  });
  
  
 }

}




7. Membuat layout xml untuk tampilan nya : Klik kanan pada folder layout (didalam folder res), New => Android XML File => ketikkan dikolom name 'main_layout' => klik finish.

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


    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content" 
        android:padding="10dp">

        <TextView
            android:id="@+id/textView1"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:paddingTop="10dp"
            android:layout_centerInParent="true"
            android:text="Kalkulator Sederhana"
            android:textAppearance="?android:attr/textAppearanceMedium" />

    </RelativeLayout>


    <LinearLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:orientation="horizontal"
    android:padding="10dp">
        
        
    <TextView
        android:id="@+id/textView2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Masukkan Angka 1" />
    

    <EditText
        android:id="@+id/angka1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:ems="10"
        android:inputType="number" >

        <requestFocus />
    </EditText>

        
    </LinearLayout>
    
    <LinearLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:orientation="horizontal"
    android:padding="10dp">
    

    <TextView
        android:id="@+id/textView3"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Masukkan Angka 2" />

    <EditText
        android:id="@+id/angka2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:ems="10"
        android:inputType="number" />
    
    
    </LinearLayout>

    <LinearLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:orientation="horizontal"
    android:padding="10dp">
    
    <TextView
        android:id="@+id/textView4"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Pilih " />
    
    <Spinner
        android:id="@+id/dropdownmenu"
        android:layout_width="match_parent"
        android:layout_height="wrap_content" />
    
</LinearLayout>

    <LinearLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:orientation="vertical"
    android:padding="10dp">

    <Button
        android:id="@+id/submit"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="Submit" />
    
</LinearLayout>

    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content" >

        <TextView
            android:id="@+id/total"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_centerInParent="true"
            android:textAppearance="?android:attr/textAppearanceLarge" />

    </RelativeLayout>
</LinearLayout>

8. Dan satu lagi, di folder res => value => strings.xml 
<resources>

    <string name="app_name">myapp</string>
    
    <string-array name="hitung">
        <item>tambah</item>
        <item>kurang</item>
        <item>bagi</item>
        <item>kali</item>
    </string-array>

</resources>

9. Dan Run ^^

Source code nya download disini
Terimakasih sudah mampir :)

Categories: , , ,

Kamis, 19 Desember 2013

Custom Button - UI - Blackberry Java

Blackberry Java - Membuat custom button user interface

Susah gak sih membuat mobile apps? Susah susah gampang, kebanyakan susahnya daripada gampangnya hehehe.. well, bagi sebagian orang yang suka tantangan sih mungkin ini akan jadi hal yang menarik. Karena akan semakin sering kita menemui hal baru untuk dipelajari.

Berikut artikel saya mengenai mobile apps dengan platform blackberry(java). Dan kita akan membuat custom seperti ini :


Image asset save di folder res :



First, buat satu aplikasi baru
Kemudian, buat satu file java bernama "CustomButtonField" :


Ketikkan script berikut ini didalam file "CustomButtonField.java" :

package mypackage;

import net.rim.device.api.ui.Field;

import net.rim.device.api.ui.Graphics;

import net.rim.device.api.ui.DrawStyle;

import net.rim.device.api.ui.XYRect;

import net.rim.device.api.ui.decor.Border;

import net.rim.device.api.ui.decor.Background;

import net.rim.device.api.ui.Keypad;

import net.rim.device.api.ui.TouchEvent;

import net.rim.device.api.system.Characters;

public class CustomButtonField extends Field {

// text color

    private int _normalColor;

    private int _focusColor;

    private int _activeColor;

    // border

    private Border _normalBorder;

    private Border _focusBorder;

    private Border _activeBorder;

    // background

    private Background _normalBackground;

    private Background _focusBackground;

    private Background _activeBackground;

    // text of the button

    private String _text;

    // flags to indicate the current visual state

    private boolean _active;

    private boolean _focus;

    // dimensions of the button's components

    private XYRect _contentRect;

    private XYRect _borderRect;

    private XYRect _backgroundRect;

    

    public CustomButtonField( String text, Border normalBorder,

            Border focusBorder, Border activeBorder,

            int normalColor, int focusColor, int activeColor,

            long style )

        {

    super( Field.FOCUSABLE | style );

        _text = text;

        _normalColor = normalColor;

        _focusColor = focusColor;

        _activeColor = activeColor;

        _normalBorder = normalBorder;

        _focusBorder = focusBorder;

        _activeBorder = activeBorder;

        _normalBackground = _normalBorder.getBackground();

        _focusBackground = _focusBorder.getBackground();

        _activeBackground = _activeBorder.getBackground();

        _borderRect = new XYRect();

        _contentRect = new XYRect();

        _backgroundRect = new XYRect();

    }

    

    public int getPreferredWidth()

    {

        if( isStyle( USE_ALL_WIDTH ) )

        {

            return Integer.MAX_VALUE;

        }

        else

        {

            return _normalBorder.getLeft() + getFont().getBounds( _text )

                + _normalBorder.getRight();

        }

    }

    

    public int getPreferredHeight()

    {

        return _normalBorder.getTop() + getFont().getHeight()

            + _normalBorder.getBottom();

    }

    

    protected void layout( int width, int height )

    {

    setExtent( Math.min( width, getPreferredWidth() ),

                Math.min( height, getPreferredHeight() ) );

    int borderLeft    = _normalBorder.getLeft();

        int borderRight   = _normalBorder.getRight();

        int borderTop     = _normalBorder.getTop();

        int borderBottom  = _normalBorder.getBottom();

        int borderWidth   = borderLeft + borderRight;

        int borderHeight  = borderTop  + borderBottom;

        getContentRect( _contentRect );

        _borderRect.set( 0, 0, getWidth(), getHeight() );

        _backgroundRect.set( borderLeft, borderTop,

            _borderRect.width - borderWidth, 

            _borderRect.height - borderHeight );

    

    }

    

    private int getTextColor()

    {

        if( _active )

        {

            return _activeColor;

        }

        else if( _focus )

        {

            return _focusColor;

        }

        else

        {

            return _normalColor;

        }

    }

    private Border getCurrentBorder()

    {

        if( _active )

        {

            return _activeBorder;

        }

        else if( _focus )

        {

            return _focusBorder;

        }

        else

        {

            return _normalBorder;

        }

    }

    private Background getCurrentBackground()

    {

        if( _active )

        {

            return _activeBackground;

        }

        else if( _focus )

        {

            return _focusBackground;

        }

        else

        {

            return _normalBackground;

        }

    }

    

    protected void paint( Graphics g )

    {

    int oldColour = g.getColor();

        try

        {

            g.setColor( getTextColor() );

            g.drawText( _text, 0, _backgroundRect.y,

                DrawStyle.HCENTER, _contentRect.width ); 

        }

        finally

        {

            g.setColor( oldColour );

        }

    }

    

    protected void paintBackground( Graphics g )

    {

    Border currentBorder = getCurrentBorder();

        Background currentBackground = getCurrentBackground();

        currentBorder.paint( g, _borderRect );

        currentBackground.draw( g, _backgroundRect );

    }

    

    protected void drawFocus( Graphics g, boolean on )

    {

    }

    

    protected void onFocus( int direction )

    {

        _focus = true;

        invalidate();

        super.onFocus( direction );

    }

    

    protected void onUnfocus()

    {

        if( _active || _focus ) {

            _focus = false;

            _active = false;

            invalidate();

        }

        super.onUnfocus();

    }

    

    protected boolean keyUp(int keycode, int time)

    {

        if( Keypad.map( Keypad.key( keycode ),

            Keypad.status( keycode ) ) == Characters.ENTER )

        {

            _active = false;

            invalidate();

            return true;

        }

        return false;

    }

    protected boolean keyDown(int keycode, int time)

    {

        if( Keypad.map( Keypad.key( keycode ),

            Keypad.status( keycode ) ) == Characters.ENTER )

        {

            _active = true;

            invalidate();

        }

        return super.keyDown( keycode, time );

    }

    protected boolean keyChar( char character, int status, int time ) 

    {

        if( character == Characters.ENTER )

        {

            clickButton();

            return true;

        }

        return super.keyChar( character, status, time );

    }

    protected boolean navigationClick(int status, int time)

    {

        _active = true;

        invalidate();

        return super.navigationClick( status, time );

    }

    protected boolean navigationUnclick(int status, int time)

    {

        _active = false;

        invalidate();

        clickButton(); 

        return true;

    }

    protected boolean invokeAction( int action ) 

    {

        switch( action )

        {

            case ACTION_INVOKE:

            {

                clickButton(); 

                return true;

            }

        }

        return super.invokeAction( action );

    } 

    public void clickButton()

    {

        fieldChangeNotify( 0 );

    }

    

    protected boolean touchEvent(TouchEvent message)

    {

        boolean isOutOfBounds = touchEventOutOfBounds( message );

        switch(message.getEvent())

        {

            case TouchEvent.DOWN:

                 if( !isOutOfBounds )

                 {

                     if( !_active )

                     {

                        _active = true;

                        invalidate();

                     }

                     return true;

                }

                return false;

            case TouchEvent.UNCLICK:

                if( _active )

                {

                    _active = false;

                    invalidate();

                }

                if( !isOutOfBounds )

                {

                    clickButton();

                    return true;

                }

            case TouchEvent.UP:

                if( _active )

                {

                    _active = false;

                    invalidate();

                }

            default : 

                return false;

        }

    }

    private boolean touchEventOutOfBounds( TouchEvent message )

    {

        int x = message.getX( 1 );

        int y = message.getY( 1 );

        return ( x < 0 || y < 0 || x > getWidth() ||

            y > getHeight() );

    }

    

    public void setDirty( boolean dirty )

    {

    }

    public void setMuddy( boolean muddy )

    {

    }

}

Masukkan script berikut ke dalam "MyScreen.java" :

package mypackage;

import net.rim.device.api.system.Bitmap;

import net.rim.device.api.ui.decor.Border;

import net.rim.device.api.ui.decor.BorderFactory;

import net.rim.device.api.ui.XYEdges;

import net.rim.device.api.ui.Field;

import net.rim.device.api.ui.container.MainScreen;

/**

 * A class extending the MainScreen class, which provides default standard

 * behavior for BlackBerry GUI applications.

 */

public class MyScreen extends MainScreen

{

    /**

     * Creates a new MyScreen object

     */

    public MyScreen()

    {              

        

        Bitmap normalBorderPic = Bitmap.getBitmapResource("custom_normal.png");

        Bitmap focusBorderPic = Bitmap.getBitmapResource("custom_focus.png");

        Bitmap activeBorderPic = Bitmap.getBitmapResource("custom_active.png");

        Border normalBorder = BorderFactory.createBitmapBorder(new

          XYEdges(10, 10, 10, 10), normalBorderPic);

        Border focusBorder = BorderFactory.createBitmapBorder(new

          XYEdges(10, 10, 10, 10), focusBorderPic);

        Border activeBorder = BorderFactory.createBitmapBorder(new

          XYEdges(10, 10, 10, 10), activeBorderPic);

        

        CustomButtonField cbf1 = new CustomButtonField("My First Button",

                normalBorder, focusBorder, activeBorder, 0x000000, 0xDDDDDD,

                0xFF0000, 0);

              cbf1.setMargin(10, 10, 10, 10);

              CustomButtonField cbf2 = new CustomButtonField("My Second Button",

                normalBorder, focusBorder, activeBorder, 0x000000, 0xDDDDDD,

                0xFF0000, Field.USE_ALL_WIDTH);

              cbf2.setMargin(10, 10, 10, 10);

              CustomButtonField cbf3 = new CustomButtonField("My Third Button",

                normalBorder, focusBorder, activeBorder, 0x000000, 0xDDDDDD,

                0xFF0000, Field.FIELD_RIGHT);

              cbf3.setMargin(10, 10, 10, 10);

              

              add(cbf1);

              add(cbf2);

              add(cbf3);

              setTitle("Custom Button Demo");

    }

}


Setelah itu, Masukkan script berikut kedalam "MyApp.java" :


package mypackage;

import net.rim.device.api.ui.UiApplication;

/**

 * This class extends the UiApplication class, providing a

 * graphical user interface.

 */

public class MyApp extends UiApplication

{

    /**

     * Entry point for application

     * @param args Command line arguments (not used)

     */

    public static void main(String[] args)

    {

        // Create a new instance of the application and make the currently

        // running thread the application's event dispatch thread.

        MyApp theApp = new MyApp();     

        theApp.enterEventDispatcher();

    }

  

    /**

     * Creates a new MyApp object

     */

    public MyApp()

    {      

        // Push a screen onto the UI stack for rendering.

        pushScreen(new MyScreen());

    }  

} 

Setelah itu, klik kanan run. Cukup mudah bukan? Programming itu mudah ^^

Categories: , , , ,

Membuat AutoComplete - UI - Blackberry Java

Selamat pagi sobat blogger:)
kali ini saya akan sedikit berbagi ilmu tentang blackberry java, yuk kita simak!;)

Pertama, kita buka eclips dan tentukan dimana kita ingin membuat workspace.

Lalu, klik file => New => Blackberry Project :

Maka akan muncul :
Isikan nama project sesuai dengan yang dimaksud lalu klik finish.
Kemudian kita akan menemui : 
Oiya nama 'AutoComplete' itu nama project yang kita buat sebelumnya, dan berikut penjelasan lengkapnya :
1. Setiap project akan berisikan folder 'src' yang menyimpan package-package kita, didalam satu package akan terdapat (secara otomatis) 2 file java (MyApp.java dan MyScreen.java) yang boleh dipakai boleh tidak, tergantung keperluan.. namun kali ini kita akan banyak menggunakan 2 file tersebut.
2. nah kalau folder 'res' itu tempat kita menyimpan image misalnya kita ingin mengganti icon/logo apps kita boleh image nya simpan di res..
3. kalau yang lainnya untuk sementara jangan di apa-apakan dulu yaa..

ok, kita langsung ke tkp ajadeh :D

double klik ya untuk MyApp.java nya lalu pastikan sudah seperti :



Perlu diketahui, nama class MyApp itu harus sama dengan nama file nya.. dan fungsi 'pushScreen' itu untuk ngepush halaman yang akan kita load, jadi intinya MyApp ini controllernya dan MyScreen itu viewnya (kalau kata Codeigniter nya sih gitu hihi) .. cukup mudah dimengerti bukan?

nah nantinya di MyScreen kita ketikan kode seperti ini :

/**
 * A class extending the MainScreen class, which provides default standard
 * behavior for BlackBerry GUI applications.
 */
public final class MyScreen extends MainScreen
{
    public MyScreen()
    {        
    setTitle("Autocomplete Text Field Demo");
    BasicFilteredList filterList = new BasicFilteredList();
    String[] days = {"Monday","Tuesday","Wendesday","Thursday","Friday","Saturday","Sunday"};
    filterList.addDataSet(1,days, "days", BasicFilteredList.COMPARISON_IGNORE_CASE);
    AutoCompleteField autoCompleteField = new AutoCompleteField(filterList);
    add(autoCompleteField);
    }


Penjelasan kode program : 
  • setTitle itu untuk title atau judulnya yg nantinya bakal ada diatas apps kita
  • BasicFilteredList itu nama objectnya yg kita buat. (kalau gak salah sih gitu hehe)
  • days, dan hari-hari seperti Monday, dkk itu data yang ingin kita cari nantinya.
  • dan add itu gunanya buat menampilkan. 
Cara runningnya, tinggal klik kanan di nama projectnya pilih Run As terus Blackberry Simulator deh (terserah mau running pake apa).
daaaaaan (ba dum tss) ini lah hasilnyaaaa, jeng jeeeeng ...

cukup mudah bukan?hehe tapi emang sih lebih mudah di PHP etapi tergantung bidangnya kaliyaaa .. okee cukup sekian postingan kali ini, semoga bermanfaat:) .


    

Categories: , , , , ,

Copyright © mzennis | Powered by Blogger

Design by Anders Noren | Blogger Theme by NewBloggerThemes.com | BTheme.net      Up ↑