I can't seem to figure out why the appearance of the soft keyboard whilst editing a text field on Android causes some of my controls to get pushed up the page. Is there a way to stop a view or a button from being moved up? It makes a real mess!
code:
registration = {};
registration.view = Titanium.UI.createView({
top : 0,
backgroundImage : GetfilePath + 'bg.png',
});
registration.init = function(view, name) {
var Scrolview = Titanium.UI.createScrollView({
top : viewTop,
height : Ti.UI.SIZE,
layout : 'vertical',
scrollType : 'vertical',
showHorizontalScrollIndicator : false
});
registration.view.add(Scrolview);
var profileView = Ti.UI.createView({
top : 10,
height : 100,
width : 100,
//backgroundColor : 'red',
});
Scrolview.add(profileView);
var profileImage = Ti.UI.createImageView({
image : GetfilePath + 'ProfilePicIcon.png',
});
profileView.add(profileImage);
var chooseprofileView = Ti.UI.createView({
top : 8,
width : deviceName == 'tab' ? '92.5%' : '92.5%',
height : deviceName == 'tab' ? 75 : 60,
});
Scrolview.add(chooseprofileView);
var chooseprofileImage = Ti.UI.createView({
backgroundImage : GetfilePath + 'ChooseProfilebutton.png'
});
chooseprofileView.add(chooseprofileImage);
var chooseprofileLabel = Ti.UI.createLabel({
text : 'Choose Profile Pic ',
color : '#E6E6E6',
font : {
fontSize : deviceName == 'tab' ? 19 : 17,
//fontWeight : 'bold',
fontFamily : os({
iphone : 'Helvetica Neue',
ipad : 'Helvetica Neue',
ipod : 'Helvetica Neue',
android : 'helveticaneue-webfont'
})
},
});
chooseprofileImage.add(chooseprofileLabel);
//alert(UserDetailsInfoData[0].UserName);
var namesurnametextfield = Titanium.UI.createTextField({
borderStyle : Ti.UI.INPUT_BORDERSTYLE_ROUNDED,
hintText : 'Name & Surname*',
backgroundColor : '#32302D',
color : 'white',
backgroundImage : 'none',
keyboardToolbarHeight : 30,
borderRadius : 10,
borderColor : '#3F4246',
borderWidth : 2,
paddingLeft : 10,
width : '90%',
height : 55,
top : '1%',
//backgroundColor:'green'
});
Scrolview.add(namesurnametextfield);
var emailtextfield = Titanium.UI.createTextField({
borderStyle : Ti.UI.INPUT_BORDERSTYLE_ROUNDED,
hintText : 'Email Address*',
backgroundColor : '#32302D',
color : 'white',
backgroundImage : 'none',
keyboardToolbarHeight : 30,
borderRadius : 10,
paddingLeft : 10,
borderColor : '#3F4246',
borderWidth : 2,
width : '90%',
height : 55,
top : '1%',
});
Scrolview.add(emailtextfield);
var cellnotextfield = Titanium.UI.createTextField({
borderStyle : Ti.UI.INPUT_BORDERSTYLE_ROUNDED,
hintText : 'Cellphone Number',
backgroundColor : '#32302D',
color : 'white',
backgroundImage : 'none',
keyboardToolbarHeight : 30,
borderColor : '#3F4246',
borderWidth : 2,
borderRadius : 10,
paddingLeft : 10,
width : '90%',
height : 55,
top : '1%',
keyboardType : Titanium.UI.KEYBOARD_NUMBER_PAD,
});
Scrolview.add(cellnotextfield);
//alert(UserDetailsInfoData[0].UserName);
var displaynametextfield = Titanium.UI.createTextField({
borderStyle : Ti.UI.INPUT_BORDERSTYLE_ROUNDED,
hintText : 'Display Name*',
backgroundColor : '#32302D',
color : 'white',
backgroundImage : 'none',
keyboardToolbarHeight : 30,
borderRadius : 10,
borderColor : '#3F4246',
borderWidth : 2,
paddingLeft : 10,
width : '90%',
height : 55,
top : '1%'
});
Scrolview.add(displaynametextfield);
};
i followed this link but the problem remains same.
ANY Solution?
Try this :
In your tiapp.xml file under android tag add this line of code :
<activity android:windowSoftInputMode="stateVisible|adjustResize" . . . >
One of the group of soft input visibility constants, SOFT_INPUT_STATE_ALWAYS_HIDDEN, SOFT_INPUT_STATE_ALWAYS_VISIBLE, SOFT_INPUT_STATE_HIDDEN, SOFT_INPUT_STATE_UNSPECIFIED, or SOFT_INPUT_STATE_VISIBLE.
One of the group of soft input adjustment constants, SOFT_INPUT_ADJUST_UNSPECIFIED, SOFT_INPUT_ADJUST_RESIZE, or SOFT_INPUT_ADJUST_PAN.
Also, check this :
Titanium windowSoftInputMode
Android windowSoftInputMode
Sample Android example here
I have never tried titanium before, however in normal Java android development. we add this code to the manifest under the related activity tag.
<activity
android:name="Your-activity-name"
android:windowSoftInputMode="adjustPan"
...
I read that there is a Custom AndroidManifest.xml in Titanuim 3.x..
Hope this works for you.
Related
The TableView is showing in iOS simulator...but it doesn't show in android physical device...
They are running the same code and without error occur.
var row = Titanium.UI.createTableViewRow({
width : Titanium.UI.FILL,
height : "20%",
left : 0,
backgroundColor : "orange",
separatorColor : "transparent",
fav_id:id,
});
var lblTitle = Ti.UI.createLabel({
top : "5%",
left : "0%",
height : Titanium.UI.SIZE,
width : "90%",
text : title,
textAlign : Ti.UI.TEXT_ALIGNMENT_LEFT,
color : "black",
//backgroundColor : 'blue',
maxLines: 2,
touchEnabled : false
});
var lblDate = Ti.UI.createLabel({
top : "50%",
left : "0%",
height : Titanium.UI.SIZE,
width : "90%",
text : date,
textAlign : Ti.UI.TEXT_ALIGNMENT_LEFT,
color : "black",
//backgroundColor : 'blue',
//maxLines:1,
touchEnabled : false
});
var lblCategory = Ti.UI.createLabel({
top : "50%",
left : "60%",
height : Titanium.UI.SIZE,
width : "90%",
text : category,
textAlign : Ti.UI.TEXT_ALIGNMENT_LEFT,
color : "black",
touchEnabled : false
//backgroundColor : 'white',
//maxLines:1,
});
row.add(lblTitle);
row.add(lblDate);
row.add(lblCategory);
dataTable.push(row);
$.tblFavourite.data = dataTable;
what happened to the android os? does design affected to the output of the tableview?
I think percentage is not working in case of tableViewRow.
Try to set row.height = "50dp"
Hope this will help you.
As Suraj already pointed out it is not possible to use percentages as the row height in Android. But there is a workaround I found in the Appcelerator forums:
You should calculate your percentage by yourself. Use Ti.Platform.displayCaps.platformWidth and Ti.Platform.displayCaps.platformHeight for your calculation.
Example for 10% height:
height : Math.floor(Ti.Platform.displayCaps.platformHeight / 10)
Im having trouble just playing a simple sound as the function is undefined. The sound files are in the right spot so I dont know what's going wrong. I am a beginner with this so help is much appreciated.
//Level 1 Page
var win = Titanium.UI.currentWindow;
var tab = Titanium.UI.currentTab;
var leveloneview = Ti.UI.createView({
width : '100%',
height : '100%',
backgroundColor : 'blue',
});
var tile1 = Ti.UI.createImageView({
bottom : '100',
width : '100',
height : '100',
image : "images/pirate-icon.png",
});
var tile2 = Ti.UI.createImageView({
left : '50',
bottom : '100',
width : '100',
height : '100',
image : "images/pirate-icon.png",
});
var tile3 = Ti.UI.createImageView({
right : '50',
bottom : '100',
width : '100',
height : '100',
image : "images/pirate-icon.png",
});
var sound = Titanium.Media.createSound({
url : 'sounds/wheres_me_rum.mp3',
preload : true
});
var button = Ti.UI.createButton({
title : 'Click to play sound',
width : '200',
height : '40',
top : 20,
align:'center',
});
button.addEventListener('click', function(e) {
sound.play();
});
leveloneview.add(tile1);
leveloneview.add(tile2);
leveloneview.add(tile3);
leveloneview.add(button);
win.add(leveloneview);
Uncaught TypeError: undefined is not a function at /index.html (line 6080)
Ti.Media.Sound is not supported on mobile web. See http://docs.appcelerator.com/titanium/latest/#!/api/Titanium.Media.Sound for supported platforms.
Please give me idea how to create a registration form in titanium and pass fill up the registration data from that form to another form .
Following is a sample code for registration. I have created an additional file 'success.js' in the resource folder, shows the second window. Please try the following code
Write these line in the app.js file
var win1 = Ti.UI.createWindow({
width : 'auto',
height: 'auto',
backgroundColor : '#FFFFFF'
});
var txtName = Ti.UI.createTextField({
top : '25%',
width : '75%',
height: '35',
hintText : 'Name'
});
win1.add(txtName);
var txtAddress = Ti.UI.createTextField({
top : '35%',
width : '75%',
height: '40',
hintText : 'Address'
});
win1.add(txtAddress);
var btnRegister = Ti.UI.createButton({
top : '55%',
width : '50%',
height : '35',
title : 'Register'
});
win1.add(btnRegister);
win1.open();
btnRegister.addEventListener('click', function(){
var win2 = Ti.UI.createWindow({
width : 'auto',
height: 'auto',
backgroundColor : '#FFFFFF',
url : 'success.js'
});
win2.name = txtName.value;
win2.address = txtAddress.value;
win2.open();
});
// Write the following lines in the success.js file
var win2 = Ti.UI.currentWindow;
var name = win2.name;
var address = win2.address;
var lblName = Ti.UI.createLabel({
top : '30%',
width : '75%',
height : 'auto',
color : 'yellow',
backgroundColor : 'blue',
text : name,
textAlign : 'center'
});
var lblAddress = Ti.UI.createLabel({
top : '40%',
width : '75%',
height : 'auto',
color : 'yellow',
backgroundColor : 'blue',
text : address,
textAlign : 'center'
});
win2.add(lblName);
win2.add(lblAddress);
now complile the code and run. It worked with me. Try it
Im having a scrollview problem and it does not work for me. Even though i have read that the scrollview contentwidth and height 'auto' has a bug and i have scaled it to a large value, it does not scroll down my content. Below is my current code as of now.
var scrollView = Titanium.UI.createScrollView({
contentWidth:'300',
contentHeight:'2000',
top:0,
showVerticalScrollIndicator:true,
showHorizontalScrollIndicator:true
});
var view = Ti.UI.createView({
backgroundColor:'#336699',
borderRadius:10,
width:300,
height:2000,
top:10
});
scrollView.add(view);
var timePickerWin = Ti.UI.createWindow({
navBarHidden : true,
backgroundColor : '#fff'
});
var label = Ti.UI.createLabel({
text:'Pick Up Detail Form',
font: {fontFamily: 'Verdana', fontSize:30},
color: '#000',
top : '15dp'
});
var label2 =Ti.UI.createLabel({
text:'Enter Your Pickup Details Below',
font: {fontFamily: 'Verdana', fontSize:12},
color: '#000',
top : '50dp'
})
var startTime = Ti.UI.createPicker({
top : '335dp',
left : '25dp',
useSpinner : false,
selectionIndicator : true,
type : Ti.UI.PICKER_TYPE_TIME,
format24 : false,
height : '130dp',
// width:'auto'
});
var startDate = Ti.UI.createPicker({
top : '200dp',
left : '25dp',
useSpinner : false,
selectionIndicator : true,
type : Ti.UI.PICKER_TYPE_DATE,
format24 : false,
height : '130dp'
});
var nextButton = Ti.UI.createButton({
width : '150dp',
height : '45dp',
top : '465dp',
title : 'Next',
backgroundColor : '#294079',
font : {
fontSize : '18dp',
fontWeight : 'bold'
},
color : '#fff'
});
nextButton.addEventListener('click', function() {
timePickerWin.hide();
});
startTime.addEventListener('change', function(e) {
//alert("User selected date: " + e.value);
startPickerValue = e.value;
});
startDate.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 : '75dp',
color : '#000000',
hintText : 'Enter full name'
// backGroundColor:'gray',
});
var addressTextBox= Ti.UI.createTextField({
borderStyle : Titanium.UI.INPUT_BORDERSTYLE_ROUNDED,
width : '275dp',
height : '45dp',
//value : '',
top : '117dp',
color : '#000000',
hintText : 'Enter Address'
});
var MobileNo = Ti.UI.createTextField({
borderStyle : Titanium.UI.INPUT_BORDERSTYLE_ROUNDED,
width : '275dp',
height : '45dp',
//value : '',
top : '155dp',
color : '#000000',
hintText : 'Enter Mobile No.'
// backGroundColor:'gray',
});
timePickerWin.add(scrollView);
timePickerWin.add(label);
timePickerWin.add(label2);
timePickerWin.add(MobileNo);
timePickerWin.add(startTime);
timePickerWin.add(startDate);
timePickerWin.add(addressTextBox);
timePickerWin.add(fullNameTextBox);
timePickerWin.add(nextButton);
timePickerWin.open()
You need to add all the contents of the scroll view into the scroll view.
Change these lines:
timePickerWin.add(scrollView);
scrollView.add(label);
scrollView.add(label2);
scrollView.add(MobileNo);
scrollView.add(startTime);
scrollView.add(startDate);
scrollView.add(addressTextBox);
scrollView.add(fullNameTextBox);
scrollView.add(nextButton);
Hope this will work for you.
I have List of Checkboxes which i want to create using FOR LOOP.
I have following type of data.
Value 1 --> checkbox image
Value 2 -->
Value 3 -->
.
.
.
Value 15 --> checkbox Image
I am using following code for that but not getting how will it work??? Is it correct code??
var chkArray = ['Value 1', 'Value 2', 'Value 3', 'Value 4', 'Value 5', 'Value 6', 'Value 7', 'Value 8', 'Value 9', 'Value 10'];
AssessmentArray = function createChkBx() {
var chkBx = [];
for(var i in chkArray) {
var t = 80;
var checkbox = Ti.UI.createSwitch({
style : Ti.UI.Android.SWITCH_STYLE_CHECKBOX,
title : chkArray[i],
value : true,
left : '20dp',
top : t + 30,
height : 25,
width : 'auto'
});
checkbox.addEventListener("change", function(e) {
Ti.API.info("The checkbox has been set to " + e.value);
});
chkBx.push(checkbox);
}
return chkBx;
}
var assessData = new AssessmentArray();
Now how should I add this to my Window??? This is specifically for Android only...
var AssessmentArray = function()
{
function AssessmentArray ()
{
//Pass the parent view inside which u want to add the check boxes and teh values as array
//gap or the distance between two checkboxes
this.addCheckBoxes = function(window, values, gap)
{
var t = 0;
var chkBx = [];
var i = 0;
for(i = 0; i < values.length; i++) {
var checkbox = Ti.UI.createSwitch({
style : Ti.UI.Android.SWITCH_STYLE_CHECKBOX,
title : chkArray[i],
value : true,
left : '20dp',
top : i * gap,
height : 25,
width : 'auto'
});
checkbox.addEventListener("change", function(e) {
Ti.API.info("The checkbox has been set to " + e.value);
});
win.add(checkbox);
chkBx.push(checkbox);
}
return chkBx;
}
}
return AssessmentArray;
}();
var ass = new AssessmentArray();
ass.addCheckBoxes(Ti.UI.createWindow(), ['Value 1', 'Value 2', 'Value 3', 'Value 4', 'Value 5', 'Value 6'], 50);
try some thing like this.
U may prefer something like this,it can be used both in Ios and Android.
var win = Titanium.UI.createWindow({
title : 'app',
backgroundColor : 'white',
fullscreen : false,
navBarHidden : true,
layout : 'vertical',
height : Ti.UI.FILL,
width : Ti.UI.FILL
});
var checkboxview = Titanium.UI.createView({
width : Ti.UI.FILL,
height : Ti.UI.SIZE,
//layout : 'horizontal',
horizontalWrap : false,
//right : '10dp',
//left : '10dp',
layout : 'horizontal',
//backgroundImage : '/images/backblue.png'
backgroundColor : '#045FB4',
//top : '20dp',
//backgroundColor:''
});
win.add(checkboxview);
var checkbox = Ti.UI.createButton({
title : '',
top : 10,
right : 10,
width : 30,
height : 30,
borderColor : 'black',
borderWidth : 2,
borderRadius : 3,
backgroundColor : 'white',
backgroundImage : 'none',
color : '#fff',
font : {
fontSize : 25,
fontWeight : 'bold'
},
value : false //value is a custom property in this casehere.
});
checkboxview.add(checkbox);
var hinttext = Ti.UI.createLabel({
color : 'black',
font : {
fontSize : '17dp',
//fontWeight : 'bold',
fontFamily : 'Rod'
},
left : '10%',
text : 'user1'
});
checkboxview.add(hinttext);
//Attach some simple on/off actions
checkbox.on = function() {
this.backgroundColor = '#007690';
this.title = '\u2713';
this.value = true;
};
checkbox.off = function() {
this.backgroundColor = '#aaa';
this.title = '';
this.value = false;
};
checkbox.addEventListener('click', function(e) {
if (false == e.source.value) {
e.source.on();
alert(hinttext.text);
} else {
e.source.off();
}
});
var checkboxview1 = Titanium.UI.createView({
width : Ti.UI.FILL,
height : Ti.UI.SIZE,
//layout : 'horizontal',
horizontalWrap : false,
//right : '10dp',
//left : '10dp',
layout : 'horizontal',
//backgroundImage : '/images/backblue.png'
backgroundColor : '#045FB4',
//top : '20dp',
//backgroundColor:''
});
win.add(checkboxview1);
var checkbox1 = Ti.UI.createButton({
title : '',
top : 10,
right : 10,
width : 30,
height : 30,
borderColor : '#666',
borderWidth : 2,
borderRadius : 3,
backgroundColor : '#aaa',
backgroundImage : 'none',
color : '#fff',
font : {
fontSize : 25,
fontWeight : 'bold'
},
value : false,
//value is a custom property in this casehere.
});
checkboxview1.add(checkbox1);
var hinttext1 = Ti.UI.createLabel({
color : 'black',
font : {
fontSize : '17dp',
//fontWeight : 'bold',
fontFamily : 'Rod'
},
left : '10%',
width : Ti.UI.SIZE,
height : Ti.UI.SIZE,
text : "User2"
});
checkboxview1.add(hinttext1);
//Attach some simple on/off actions
checkbox1.on = function() {
this.backgroundColor = '#007690';
this.title = '\u2713';
this.value = true;
};
checkbox1.off = function() {
this.backgroundColor = '#aaa';
this.title = '';
this.value = false;
};
checkbox1.addEventListener('click', function(e) {
if (false == e.source.value) {
e.source.on();
alert(hinttext1.text);
} else {
e.source.off();
}
});