Appcelerator show an image - android

Greetings,
I'm trying to simply display an image using Appcelerator on Android.
I don't understand why it won't work.
Here is my code:
var back=Titanium.UI.createImageView({
url:'images/back.png'
});
win.add(back);
I've also tried putting the image inside a view:
var view = Titanium.UI.createView({
borderRadius:10,
backgroundColor:'red',
left:10,
right:10
});
var back=Titanium.UI.createImageView({
url:'images/back.png'
});
view.add(back);
win.add(view);
I'm totally stuck and am hoping someone can point me in the right direction here.
Many thanks in advance,

I got it working as follows:
var back_fn=Ti.Filesystem.getFile(Titanium.Filesystem.resourcesDirectory,'images/back.png');
var back=Titanium.UI.createImageView({
image:back_fn,
top:10,
right:10
});
win.add(back);
Thanks for all the responses guys,

try this
var back=Titanium.UI.createImageView({
url:'images/back.png',
height : 130,
width : 130
});

Related

Rotate and save image in Titanium?

I am currently working on an android app that allow user to rotate the image then save it. I am able to save the image but when I check it, it doesn't rotate. Would appreciate if someone can point me to a right direction.
Here is my code:
_rotateLeft.addEventListener('click', function(e){
_rotationDegree = _rotationDegree - 90;
var t = Ti.UI.create2DMatrix();
//t.rotate(90);
//imageContainer.transform = t;
imageContainer.animate({
transform: t.rotate(_rotationDegree)
});
});
_saveButton.addEventListener('click', function(){
var imgSave = imageView.toImage();
var moment = require('alloy/moment');
var directory = Ti.Filesystem.getFile(Ti.Filesystem.externalStorageDirectory, 'images/test');
!directory.exists() && directory.createDirectory();
var fileName = String.format('rotate_%s.jpg', moment().format('YYYY-MM-DD-HH-mm'));
var file = Ti.Filesystem.getFile(directory.resolve(), fileName);
var fileNativePath = file.nativePath;
// Write media to file
//file.write(newBlob);
file.write(imgSave);
Ti.API.info('New Save File : ' + JSON.stringify(file));
imageView.setImage(file);
});
Here is my view:
<View id="imageContainer">
<!--<View id="imageUploadedView"></View>-->
<ImageView id="imageView"></ImageView>
</View>
There are 2 things I found odd in your code:
1 - You are rotating imageContainer and then you are capturing imageView.toImage(); which I think is the cause of issue because:
Rotating container view rotates the child elements also, and capturing a child.toImage(); will return you the UI of that child irrespective of the rotation (though I am not 100% sure because I would prefer below step to do this task).
So to make to properly work, rotate imageView and use imageContainer.toImage(); so that child view is rotated and parent view can save its rotated state.
2 - Inside _saveButton click event, use this line:
imageView.setImage(file.read()); because you were not reading the blob data of the file in your code.
You need to declare the transform first then apply the transform to the view before saving.
_rotateLeft.addEventListener('click', function(e){
var rotateTransform = Ti.UI.create2DMatrix({
rotate: 45
});
imageContainer.transform = rotateTransform;
}
Reference: http://docs.appcelerator.com/platform/latest/#!/api/Titanium.UI.2DMatrix

Titanium not recognizing its own API for android

I have a window that's part of a tab group. When I try to set the right nav button, I get the following runtime error:
Uncaught TypeError: Object #Window has no method setRightNavButton
However, the method is clearly listed in the API for Titanium.UI.Window. Interestingly enough, it doesn't have a problem with the setLeftNavButton method which is executed just before. Also, it executes perfectly running on ios, but has issues when running on android. Any help would be greatly appreciated.
Here's the code to create the window in question:
var queryWindow = Titanium.UI.createWindow({
barColor : '#1ADC2FF',
layout : 'vertical',
backgroundColor : '#1389d1',
title : L('Search'),
fullscreen : true
});
var clearButton = Ti.UI.createButton({
title : L('Clear'),
style : Titanium.UI.iPhone.SystemButtonStyle.BORDERED,
right : 10,
width : 60,
font : {
fontSize : 14
},
color : '#2952CC',
height : 30
});
....<MORE UI INITIALIZATION>....
queryWindow.setLeftNavButton(findButton);
queryWindow.setRightNavButton(clearButton); //Error thrown here
queryWindow.add(queryTable);
queryWindow.add(queryView);
return queryTab;
The method setRightNavButton and setLeftNavButton is only for iOS, that's why it throw an error on Android : http://docs.appcelerator.com/platform/latest/#!/api/Titanium.UI.Window-method-setRightNavButton

Disable animation on image recognition with Wikitude SDK 3.0

I'm integrating a modified SDK 3.0 sample into a big app in which I'm working.
When I detect whatever Trackable2DObject and show an ImageDrawable (for example, the surf table), this ImageDrawable appears from the z-index very slowly.
Is there any way to disable this animation?
Thanks in advance!
EDIT: My JS code only contains this:
var World = {
loaded: false,
init: function initFn() {
this.createOverlays();
},
createOverlays: function createOverlaysFn() {
// Initialize Tracker
this.tracker = new AR.Tracker("assets/wul4bus.wtc", {
onLoaded: this.worldLoaded
});
// Create overlay for page one
var imgOne = new AR.ImageResource("assets/redsys_marker_orange.png");
var overlayOne = new AR.ImageDrawable(imgOne, 0.5, {
zorder: 0,
offsetX: -0.15,
offsetY: 0,
onClick: this.createClickTrigger
});
var titleLabel = new AR.Label("Bus", 0.07, {
zOrder: 1,
offsetX: -0.15,
offsetY: 0.04,
style: {
textColor: '#FFFFFF',
fontStyle: AR.CONST.FONT_STYLE.BOLD
}
});
var pageOne = new AR.Trackable2DObject(this.tracker, "002", {
drawables: {
cam: [overlayOne, titleLabel]
}
});
},
createClickTrigger: function createClickTriggerFn() {
document.location = "architectsdk://product?id=1236";
},
worldLoaded: function worldLoadedFn() {
document.body.removeChild(document.getElementById('loadingMessage'));
}
};
World.init();
As you see, there is no AR.PropertyAnimation class along this code. Anyway, a small animation succedeed sometimes when the target is discovered, and trackable object appears a bit slowly, slower than SDK 2 IMHO. It happens with some Trackable2DObject more than others.
Please have a look at the API Reference of the Wikitude SDK.
You will find details around Animations there.
If you need a Sample collection and platform specific stuff, have a look at the Wikitude Documentation page.
Kind regards,
Andreas

Titanium accessing child of a view returns null

I get null on
view.children[0]
The view is a Titanium.UI.View-object and has just one child Titanium.UI.ImageView-object that need to access. How do I fix this?
I have had a look at How to query the child views of a parent view using Titanium? but it doesn't work for me. I found this, http://developer.appcelerator.com/question/31361/how-to-access-child-view-of-a-tableview-row , it could be a reason for my problem, any clue if this bug has been fixed?
Here is the more detailed code.
function (parentView, id, leftMargin) {
var cellImageView = cellImageView = Titanium.UI.createImageView({
url: imageUrl
});
var cellView = Ti.UI.createView({
id: id,
left: leftMargin,
parent: parentView
});
cellView.addEventListener('click', function (e) {
Titanium.API.info("you clicked1:" + e.source.id);
OnNumClick(e.source, e.source.parent);
});
cellView.add(cellImageView);
return cellView;
}
OnNumClick = function (cellViewObj) {
Titanium.API.info("cellViewObj:" + cellViewObj);
Titanium.API.info("cellViewObj.children:" + cellViewObj.children);
};
result:
[INFO] [7,10537] cellViewObj:ti.modules.titanium.ui.ViewProxy#437ba5a8
[INFO] [15,10628] cellViewObj.children:null
My bad, I upgraded from Titanium SDK 1.2 to 1.6 (for some reason my setup was not working with 1.6 earlier), and it finally worked. Thanks for your help Muhammad.

Appcelerator simple textfield not showing

Greetings,
I'm trying to simply display a blank textfield (I know), but it's not working?
I must be making some simple error.
Here is my app.js:
Titanium.UI.setBackgroundColor('#FFF');
var win1=Titanium.UI.createWindow({
title:'Login',
backgroundColor:'#FFF'
});
var uname = Titanium.UI.createTextField({
color:'#336699',
height:35,
top:50,
width:250,
borderStyle:Titanium.UI.INPUT_BORDERSTYLE_ROUNDED
});
win1.add(uname);
Am I missing something? The above should work, right?
I'm using Android emulator on Ubuntu x86_64
When I use tabs the uname and label appear ok:
Titanium.UI.setBackgroundColor('#000');
var tabGroup = Titanium.UI.createTabGroup();
var win1 = Titanium.UI.createWindow({
title:'Tab 1',
backgroundColor:'#fff'
});
var tab1 = Titanium.UI.createTab({
icon:'KS_nav_views.png',
title:'Tab 1',
window:win1
});
var uname=Titanium.UI.createTextField({
color:'#336699',
height:35,
top:50,
width:250,
borderStyle:Titanium.UI.INPUT_BORDERSTYLE_ROUNDED
});
var label1=Titanium.UI.createLabel({
color:'#999',
text:'hello',
font:{fontSize:20,fontFamily:'Helvetica Neue'},
textAlign:'center',
width:'auto'
});
win1.add(uname);
win1.add(label1);
tabGroup.addTab(tab1);
tabGroup.open();
But how do I get rid of the tabs???
I've tried several versions of Android (1.6 API and 2.2 API)
Many thanks in advance,
Update: the solution is:
Add the following line:
win1.open({fullscreen:true});
is this on the end of you app.js
win1.open({fullscreen:true});

Categories

Resources