Thursday 29 August 2013

Android Native Controls Module for Titanium

NativeControls - This module helps to create android native controls in titanium.

My Colleague J.Kabeer given an idea to implement module for missing Android native controls.

Initially we start this module with RadioGroup and later version we will plan to update most of the controls.

Feature:
  • Create android native RadioGroup in titanium
  • You can set the default selectedIndex value to RadioGroup
  • You can add "chage" EventListener to RadioGroup
  • You can get selected RadioButton Object value  using getSelectedIndexValue() Method
  • Define text color by set textColor value
  • Define layoutType by set the layoutType = "horizontal/vertical"
  • Passing radio buttons as array of object in "buttons"  

Usage:
var nativecontrols = require('learnappcelerator.nativecontrols');

var radiogroup = nativecontrols.createRadioGroup({
 width : Ti.UI.SIZE,
 height : Ti.UI.SIZE,
 top : 100,
 left : 10,
 textColor : "",
 selectedIndex : 2,
 layoutType : "vertical",
 buttons : [{
  id : 1,
  text : 'value 11'
 }, {
  id : 2,
  text : 'value 12'
 }, {
  id : 3,
  text : 'value 13'
 }]
});

radiogroup.addEventListener('change', function(e) {
 alert(JSON.stringify(e.result));
 var obj=radiogroup.getSelectedButton();
 Ti.API.info("selected ButtonValue ="+JSON.stringify(obj));
});

win.add(radiogroup);


Screenshots




Version 1.1 -    RadioGroup   - available

Version 1.2 -  AutoCompleteTexBox  - will update soon.

Download:
Module:  https://marketplace.appcelerator.com/apps/6378?759209041

Wednesday 21 August 2013

Alloy - REST API Json to TableView

Hi,

I am creating simple application for fetching JSON data from REST API and display the data to Table View.

You can download the source code from json2tableview repository

Steps:


1. Create simple alloy Project
2. Modify index.xml

 

 
  
 



3. Modify index.js
function openDetail(e) {
 alert('row index = ' + JSON.stringify(e.index));
 //Ti.API.info('row rowData = ' + JSON.stringify(e.rowData));
 //Ti.API.info('row index = ' + JSON.stringify(e..index));
}

var data = [];

var sendit = Ti.Network.createHTTPClient({

 onerror : function(e) {

  Ti.API.debug(e.error);

  alert('There was an error during the connection');

 },

 timeout : 1000,

});

// Here you have to change it for your local ip

sendit.open('GET', 'https://maps.googleapis.com/maps/api/place/nearbysearch/json?types=hospital&location=13.01883,80.266113&radius=1000&sensor=false&key=AIzaSyDStAQQtoqnewuLdFwiT-FO0vtkeVx8Sks');

sendit.send();

// Function to be called upon a successful response

sendit.onload = function() {

 var json = JSON.parse(this.responseText);

 // var json = json.todo;

 // if the database is empty show an alert

 if (json.length == 0) {
  $.table.headerTitle = "The database row is empty";
 }

 // Emptying the data to refresh the view

 // Insert the JSON data to the table view
 var countries = json.results;
 for ( var i = 0, iLen = countries.length; i < iLen; i++) {

  data.push(Alloy.createController('row', {
   icon : countries[i].icon,
   name : countries[i].name

  }).getView());

  // data.push(row);

  Ti.API.info(countries[i].icon);
  Ti.API.info(countries[i].name);

 }

 $.table.setData(data);
};

$.index.open();

4. Create Alloy Controller row (it create row.xml, row.js, row.tss)
5. Modify row.xml
 

 
  >
  


6. Modify row.js
 
var args = arguments[0] || {};

$.icon.image = args.icon;
$.catID.text = ar

7. Add styles to tss files
index.tss
 
"Window":{
 backgroundColor :"#FFF",
 exitOnClose:true,
 navBarHidden:true
}


row.tss
 
"#icon":{
 left:0,
 height:50,
 width:50
}

"TableViewRow":{
 layout:"horizontal"
}

"Label":{
 color:'#000',
 font:{
  fontFamily:"Ariel",
  fontSize:'20dp',
  fontWeight:'bold'
 }
}



Thanks

Sunday 11 August 2013

Pinterest Module for Photo sharing - Titanium

Hi.

Recently I have developed new titanium module for photo sharing in "Pinterest". This module helps you to sharing images in pinterest. Currently this module only for android.

Download module from here Pinterest - Android Module

Pinterest Module

Description

This module is used to share the photos in pinterest from titanium.

Accessing the pinterest-android Module

To access this module from JavaScript, you would do the following:
var pinterest = require("learnappcelerator.pinterest");
The pinterest variable is a reference to the Module object.

setClientId("clientId");

This is an required Field. You should login into developer.pinterest.com and register you appname. you can get client ID.

pinterest.setClientId("xxxxxxx"); //replace with your client ID

setDebugMode(flag);

This property is optional. If you want to get error logs in console set this as true.
pinterest.setDebugMode(true);

pinterest.createPinterest()

This method used to create the pinIt button.

Usage

var pinterest = require("learnappcelerator.pinterest");
pinterest.setClientId("xxxxxxx");
pinterest.setDebugMode(true);
var pin1 = pinterest.createPin({
        width: 150,
        height: 90,
        top: 100,
        left: 150,
        imageUrl:"http://placekitten.com/400/300",
        baseUrl:"http://placekitten.com",
        description:"kitten image!"
});
win.add(pin1);

Author

Author Name : M. Prakash
Email : prakashmca.m@gmail.com
Blog : http://www.learnappcelerator.blogspot.com

Screen shots:




Thanks.