I'm trying to create a label that allows user to select a date in Titanium. My code compiles, but it displays both the date and time when I ask for date only (note: I do my testing with an Android emulator). Can someone take a look at my code and give me a hint on how to solve this issue? Your help is greatly appreciated!
//create a new window
var addWin = Titanium.UI.createWindow({
title: "Add New Entry",
backgroundColor: '#ffffff'
});
//header
//addWin.add(Inova.ui.createHeaderView()); //error
//body
var body = Titanium.UI.createView({
backgroundColor:'#fff',
height: 800,
layout: 'vertical'
});
//Addin a label to the body
body.add(Titanium.UI.createLabel({
text: 'New Travel Entry',
top: 10,
color: '#008000',
textAlign: 'center',
font: {fontSize:20},
width:'auto', //Define width of the label
height:'auto' //Define height of the label
}));
var dateLabel = Titanium.UI.createTextField({
text: 'Date: ',
hintText:'Click here to select a date',
font: {fontSize: 20},
top:20,
left:10,
width:'auto',
height: 'auto',
color: '#336699',
editable:false,
borderStyle:Ti.UI.INPUT_BORDERSTYLE_ROUNDED
});
var dateUpdated = false;
dateLabel.addEventListener('click', function(e){
var picker = Titanium.UI.createPicker({
type: Titanium.UI.PICKER_TYPE_DATE,
minDate: new Date(2012,1,1),
maxDate: new Date(2014,12,30),
value: new Date(2013,12,2)
});
picker.showDatePickerDialog({
value: new Date(2012,12,2),
callback: function(e)
{
if (e.cancel)
{
Titanium.API.info('User canceled dialog');
} else
{
Titanium.API.info ('USer selected date: ' + e.value);
dateLabel.value = e.value;
dateLabel.text = (e.value.getMonth() + 1) + '/' + e.value.getDate() + '/' + e.value.getFullYear(),
dateUpdated = true;
}
}
});
});
body.add(dateLabel);
addWin.add(body);
addWin.open();
your problem starts here:
var dateLabel = Titanium.UI.createTextField({
text: 'Date: ',
You are not defining a Label but a TextField. I would change its name to dateField or dateTextField for clarity.
A TextField doesn't have a text property, it has a value property.
You are setting dateLabel.value = e.value; and that's why you are seeing values that the one you mentioned Sun Feb 02 14:08:28 PST 2013. That fragment should change to:
...
var dateUpdated = false;
dateLabel.addEventListener('click', function(e){
...
} else
{
Titanium.API.info ('USer selected date: ' + e.value);
dateLabel.value = e.value.toDateString().slice(4);
dateUpdated = true;
}
...
This way, dateLabel.value will produce something like "Dec 02 2013"
Related
I am new to the scene and wonder how i am to go about this.
I have a switch that should add +1 or a "point" to a label when the switch is true.
and When it is false it should withdraw that same "point".
var win = Ti.UI.createWindow({
backgroundColor: 'white'
});
var view = Ti.UI.createView();
var win = Ti.UI.createWindow({
backgroundColor: 'white'
});
var basicSwitch = Ti.UI.createSwitch({
title: "+1"
});
basicSwitch.addEventListener('click',function(e){
});
var label1=Ti.UI.createLabel({
text: ""
});
view.add(basicSwitch);
win.add(view);
win.open();
My code so far,not much i know.
Here you go first of all their are following errors in your code
1)Making window 2 times
2)Creating a label but not adding to parent container
3)Switch has change event listener instead of click one
4)You can set the switch title
and Here goes the correct code
var win = Ti.UI.createWindow({
backgroundColor : 'white'
});
var view = Ti.UI.createView({
width : Ti.UI.FILL,
height : Ti.UI.FILL
});
var basicSwitch = Ti.UI.createSwitch({
top : 30,
value : false,
});
basicSwitch.addEventListener('change', function(e) {
if (e.value = true) {
label1.text = 1;
} else {
}
});
var label1 = Ti.UI.createLabel({
text : ""
});
view.add(label1);
view.add(basicSwitch);
win.add(view);
win.open();
Thanks
I'm using the code bird library to integrate a twitter feed into a titanium app. At the minute I'm only interested in text and an image. I am getting these elements fine in the console and my entire code is getting no errors, however, the table is not appearing in the app. I have replaced the key and secret key with correct values. See code below:
var tableView= Titanium.UI.createTableView({
zIndex:60
});
var rowData;
var win= Titanium.UI.createWindow({
backgroundColor:"white"
});
var Codebird = require("codebird");
var cb = new Codebird();
cb.setConsumerKey('consumer key', 'consumer secret');
var bearerToken = Ti.App.Properties.getString('TwitterBearerToken', null);
if(bearerToken == null){
cb.__call(
'oauth2_token',
{},
function (reply) {
var bearer_token = reply.access_token;
cb.setBearerToken(bearer_token);
Ti.App.Properties.setString('TwitterBearerToken', bearer_token);
fetchTwitter();
}
);
}
else {
Ti.API.info("We do have a bearer token...----------------------------------------------------------------------------");
cb.setBearerToken(bearerToken);
fetchTwitter();
}
function fetchTwitter(){
var data = [];
cb.__call(
'statuses/user_timeline',
"screen_name=ClassicHits4FM",
function (reply) {
// ...
Ti.API.info("newest and Example that should work just reply------------------------------"+ reply);
Ti.API.info("newest and Example that may work, reply's text ------------------------------"+ reply[0].text);
Ti.API.info("newest and Example that may work, reply's text ------------------------------"+ reply[0].user.profile_image_url);
for(i=0;i<10;i++){
data.push({
title: reply[i].text,
leftImage:reply[0].user.profile_image_url
});
//alert("Data test ----------------------------------"+data[i].title);
}
//Ti.API.info("newest Example that should work, user profile image ------------------------------"+ reply[0].user[0].profile_image_url);
},
true // this parameter required
);
rowData=[];
for(i=0;i<data.length;i++){
var img= Titanium.UI.createImageView({
image:data[i].leftImage,
left:5,
bottom:5,
top:5,
height: '120dp',
width: '120dp'
//height: "120%",
//width: "34%"
});
var title=Titanium.UI.createLabel({
text:data[i].title,
color: 'black',
//left: "38%",
left: '128dp',
right: '4dp',
font:{ fontSize: '15sp', font: 'Droid Serif'}
});
var row=Titanium.UI.createTableViewRow({
height: TI.UI.SIZE
});
row.add(img);
row.add(title);
rowData.push(row);
}
tableView.setData(rowData);
win.add(tableView);
}
win.open();
var tableView= Titanium.UI.createTableView({
zIndex:60,
width : Ti.UI.FILL,
height: Ti.UI.FILL
});
Solved the problem, by moving all code from 'rowdata' onwards into the 'cb.__call' statement block.
Also, in my row definition I had written TI.UI.SIZE which needed to be Ti.UI.SIZE
This is my first question in this community that refers to the API of titanium studio. I explain: I'm trying to put a textField inside a listView an item, but when compiled and when to focus on the text area will not let me write and when it does it does in other type of listView.
I hope you can help with this
var win = Ti.UI.createWindow({
backgroundColor:'#FFF'
});
var plainTemplate = {
childTemplates: [
{
type: 'Ti.UI.Label',
bindId: 'title',
properties: {
width: '100%',
height: 30,
left: 0,
top:0
}
},
{
type: 'Ti.UI.TextArea',
bindId: 'campo',
properties: {
top:60,
width: '70%',
left:10,
height:40
}
}
],
events: {click: check }
};
var listView = Ti.UI.createListView({
templates: { 'uncheck': plainTemplate},
defaultItemTemplate: 'uncheck'
});
var data = [];
for (var i = 0; i < 20; i++) {
data.push({
title : { text: 'row' + i },
properties : {
itemId: 'row' + i,
accessoryType: Ti.UI.LIST_ACCESSORY_TYPE_NONE,
}
});
}
var section = Ti.UI.createListSection();
section.setItems(data);
listView.sections = [section];
function check() {
alert('estas aqui!!');
}
win.add(listView);
win.open();
Have you tried out to remove the top-Property in UITextArea of 60px? That could be the reason, why your textarea is at another position as you've expected:
{
type: 'Ti.UI.TextArea',
bindId: 'campo',
properties: {
// top: 60 <--- remove that line
width: '70%',
left:10,
height:40
}
}
I haven't tested your whole code, but i added this value for a top property to a ListView in an App where i am working on and it ended in an similar behaviour as you wrote.
I am retrieving the json data using titanium.But the problem is that whenever i calculate the length of json data it says can not read length of null Here is my code:
Ti.UI.setBackgroundColor('#000');
var win1 = Ti.UI.createWindow({
backgroundColor : '#fff',
title : 'Tab 1'
});
var tab1 = Ti.UI.createTab({
icon : 'KS_nav_views.png',
title : 'Tab 1',
window : win1
});
var JsonTable = Ti.UI.createTableView({
height : Ti.UI.FILL,
width : Ti.UI.FILL
});
win1.add(JsonTable);
function getData() {
var myfontsize = '14dp';
// I needed to add this to test
var tableData = [];
var Json, Story;
var xhr = Ti.Network.createHTTPClient({
onload : function() {
var json = JSON.parse(this.responseText);
// declare your variables :-)
//alert(JSON.stringify(Story));
// alert(Story.nombre);
alert(json.length);
// only one . between things
for (var i = 0; i < json.length; i++) {
Story = json[i];
//Ti.API.info('Story', JSON.stringify(Story));
//Ti.API.info('Story.nombre', Story.nombre);
var row = Ti.UI.createTableViewRow({
backgroundColor : 'yellow',
height : '85dp',
width : Ti.UI.FILL
});
var labTitle = Ti.UI.createLabel({
backgroundColor : 'orange',
color : 'black',
font : {
fontSize : myfontsize,
fontWeight : 'bold'
},
height : Ti.UI.SIZE,
left : '25%',
text : Story.nombre,
top : '2%',
width : Ti.UI.FILL
});
row.add(labTitle);
tableData.push(row);
}
JsonTable.setData(tableData);
},
onerror : function(e) {
Ti.API.debug("STATUS: " + this.status);
Ti.API.debug("TEXT: " + this.responseText);
Ti.API.debug("ERROR: " + e.error);
alert('There was an error retrieving the remote data. Try again.');
},
timeout : 5000
});
JsonTable.addEventListener('click', function(e) {
var index = e.index;
});
xhr.open("GET", "http://aplicaciones4.sct.gob.mx/sibuac_internet/SerEscogeRuta?estados");
xhr.send();
}
var btnGo = Ti.UI.createButton({
title : 'Go'
});
btnGo.addEventListener('click', function(e) {
getData();
});
//win1.setRightNavButton(btnGo);
win1.add(btnGo);
var img = Ti.UI.createImageView({
height : 32,
image : 'activity_indicator.gif',
width : 32
});
//win1.add(img);
var tabGroup = Ti.UI.createTabGroup();
tabGroup.addTab(tab1);
tabGroup.open();
Can you help me in this
Thanks in advance
Try naming the result something other than "json".
Also, there's sloppy var declarations...
"var Json,Story;" << "J"son upper-case, never used
Im a Titanium Beginner who is trying to create a form page with 2 textfields of Name and address and a DateTimePicker. I am facing 2 problems right now being :
1) the DateTimePicker is successfully shown but i would like both of it and also including the 2 textfields to be on the same window, with a same submit button.
2) I have tried numerous times but am unable to create a simple textfield at all even just creating it on a single page.It just doesnt show up.
Anyone could offer some constructive help?
Thanks in advance. The Below is my current code.
var winTimePicker = Titanium.UI.createWindow({});
winTimePicker.backgroundColor = 'black';
var doneBtn = Ti.UI.createButton({
title: 'Done',
});
doneBtn.addEventListener('click', function() {
winTimePicker.hide();
});
winTimePicker.add(doneBtn);
var timePicker = Ti.UI.createPicker({
type:Ti.UI.PICKER_TYPE_TIME,
bottom:0,
});
// turn on the selection indicator (off by default)
timePicker.selectionIndicator = true;
timePicker.addEventListener('change', function(e) {
//your code
});
winTimePicker.add(timePicker);
//open window
winTimePicker.open();
var winDatePicker = Titanium.UI.createWindow({});
winDatePicker.backgroundColor = 'black';
var doneBtn = Ti.UI.createButton({
title: 'Done',
});
doneBtn.addEventListener('click', function() {
winDatePicker.hide();
});
winDatePicker.add(doneBtn);
var datePicker = Ti.UI.createPicker({
type:Ti.UI.PICKER_TYPE_DATE,
bottom:0,
});
// turn on the selection indicator (off by default)
datePicker.selectionIndicator = true;
datePicker.addEventListener('change', function(e) {
//your code
});
winDatePicker.add(datePicker);
//open window
winDatePicker.open();
var textField = Titanium.UI.createTextField({
color:'#336699',
width:"auto",
height:"auto",
borderStyle:Titanium.UI.INPUT_BORDERSTYLE_ROUNDED,
});
var textField2 = Titanium.UI.createTextField({
color:'#336699',
width:"auto",
height:"auto",
borderStyle:Titanium.UI.INPUT_BORDERSTYLE_ROUNDED,
});
Check this code out and make changes as you find suitable to it:
var timePickerWin = Ti.UI.createWindow({
navBarHidden : true,
backgroundColor : '#fff'
});
var startTime = Ti.UI.createPicker({
top : '15dp',
left : '50dp',
useSpinner : false,
selectionIndicator : true,
type : Ti.UI.PICKER_TYPE_TIME,
format24 : false,
height : '130dp',
// width:'auto'
});
var endTime = Ti.UI.createPicker({
top : '15dp',
left : '50dp',
useSpinner : false,
selectionIndicator : true,
type : Ti.UI.PICKER_TYPE_TIME,
format24 : false,
height : '130dp'
});
var nextButton = Ti.UI.createButton({
width : '220dp',
height : '45dp',
top : '15dp',
title : 'Next',
backgroundColor : '#294079',
font : {
fontSize : '18dp',
fontWeight : 'bold'
},
color : '#fff'
});
startTime.addEventListener('change', function(e) {
//alert("User selected date: " + e.value);
startPickerValue = e.value;
});
endTime.addEventListener('change', function(e) {
//alert("User selected date: " + e.value);
endPickerValue = e.value
});
var fullNameTextBox = Ti.UI.createTextField({
borderStyle : Titanium.UI.INPUT_BORDERSTYLE_ROUNDED,
width : '275dp',
height : '45dp',
//value : '',
top : '15dp',
color : '#000000',
hintText : 'Enter full name'
// backGroundColor:'gray',
});
var emailTextBox = Ti.UI.createTextField({
borderStyle : Titanium.UI.INPUT_BORDERSTYLE_ROUNDED,
width : '275dp',
height : '45dp',
//value : '',
top : '15dp',
color : '#000000',
hintText : 'Enter email'
});
Finally add all these UI elements to the window which is the timePickerWin using add function
timePickerWin.add(startTime);
and so on for all the UI elements.After that open the timePickerWin as below
timePickerWin.open()
Make suitable layout changes by varying the left,right,height and width properties of each element.