Appcelerator titanium TableView with Android 4.x zoomed out - titanium

I am working on appcelerator titanium. After I copied almost the same code in KitchenSink to do a tableview, I ended up with a zoomed out TableView when i display it in my device ( android 4 on Galaxy Nexus ). Zoomed out means font and images are really small. What's weird is: 1- it displayed just right in the android emulator 2- it displayed just right in my android device but using KitchenSink
What can be the problem ?
here is the code for that part:
if (Ti.Platform.name == 'android')
{
Titanium.UI.currentWindow.backgroundColor = '#4e5c4d';
}
else
{
Titanium.UI.currentWindow.backgroundColor = '#aebcad';
}
// create table view data object
var data = [
{title:'Table View (Layout 2)', hasChild:true, test:'../main_windows/profile.js'}
];
// create table view
var tableViewOptions = {
data:data,
style:Titanium.UI.iPhone.TableViewStyle.GROUPED,
headerTitle:'TableView examples and test cases',
footerTitle:"Wow. That was cool!",
backgroundColor:'transparent',
rowBackgroundColor:'white'
};
var tableview = Titanium.UI.createTableView(tableViewOptions);
// create table view event listener
tableview.addEventListener('click', function(e)
{
if (e.rowData.test)
{
var win = Titanium.UI.createWindow({
url:e.rowData.test,
title:e.rowData.title
});
Titanium.UI.currentTab.open(win,{animated:true});
}
});
// add table view to the window
Titanium.UI.currentWindow.add(tableview);

SOLVED:
I had to change the tiapp.xml file and add the line:
<supports-screens android:anyDensity="false"/>
in the android mainfest section
so it is now:
<android xmlns:android="http://schemas.android.com/apk/res/android">
<manifest>
<supports-screens android:anyDensity="false"/>
</manifest>
</android>

You should watch out because googles advice is to use this only for Android 1.4 and lower.
The better solution would be to create images which fits the screen size.
See http://developer.android.com/guide/topics/manifest/supports-screens-element.html#any

Related

howTo get Image Resource of a ImageButton in kotlin

i want change the ImageResource of a ImageButton that i have find by id.
Motivation
a ImageButton(bottom) works as a reminder/backup of the last click of a ImageButton(top) .
setup:
some ImageButton (at the top of the app).
a ImageButton (at the bottom of the app).
example without errors, but don't find ImageResource of idR1
findViewById<ImageButton>(idR1).setOnClickListener {
findViewById<ImageButton>(idR5_oppCiv).setImageResource(R.drawable.athen_cavalry_swordsman);
not working examples
findViewById<ImageButton>(idR1).setOnClickListener {
findViewById<ImageButton>(idR5_oppCiv).setImageResource(it.resources.getDrawable());
findViewById<ImageButton>(idR1).setOnClickListener {
findViewById<ImageButton>(idR5_oppCiv).setImageResource(it.getImageResource());
try to get and set Drawable
following causes the app to crash when i click on an ImageButton.
Here i use a defType "res" to get the resource (the image hopefully).
val resR1: Int = resources.getIdentifier("r1col$i", "res", this.packageName)
findViewById<ImageButton>(idR1).setOnClickListener {
findViewById<ImageButton>(idR5_oppCiv).setImageDrawable(getDrawable(resR1))
How could i get this image resource of it ? And use it for the other ImageButton?
You should be setting the image like using setImageDrawable like this.
val image = findViewById<ImageButton>(R.id.your_view_id)
image.setOnClickListener {
findViewById<ImageButton>(idR5_oppCiv).setImageDrawable(image.drawable)
}

Why are images in react-native app not rendering after Xcode 12 update

Not sure what to even document here. I update Xcode to 12.0.1, and out of nowhere, after building and running my application, the images inside the app are not rendering, not counting the splash screen, containing an image, which are built out natively.
These images, whether they're coming from firebase storage (remotely) or whether they're icons (locally) are simply not rendering. no changes in any image code or anything, anywhere in the application. the only change was the Xcode 12 update. and also a macOS update to Catalina 10.15.7
Any ideas on whats going on? let me know If I can provide additional details.
This behavior is a known issue with iOS 14 as you can see here.
You need to change the following file:
react-native/Libraries/Image/RCTUIImageViewAnimated.m
and add the following line:
- (void)displayLayer:(CALayer *)layer
{
if (_currentFrame) {
layer.contentsScale = self.animatedImageScale;
layer.contents = (__bridge id)_currentFrame.CGImage;
} else {
[super displayLayer:layer]; // add else statement with this line here
}
}
Source: https://github.com/facebook/react-native/issues/29279#issuecomment-658244428

Splash screen fade-out in titanium

I want to fade out the splash screen.
I think it's possible in native code android or iOS.
However for titanium which way is the appropriate ??
for now my source code is this
var topWin = Ti.UI.createWindow();// main application window.
var img = Ti.UI.createImageView({
image : '/img/Default.png',
top : 0,
left : 0,
width : '100%',
height : '100%'
});
var splash = Ti.UI.createWindow(); //splash window
splash.add(img);
splash.open();
var fadeOut = Ti.UI.createAnimation({
opacity : 0.2,
duration : 300
});
var fadeIn = Ti.UI.createAnimation({
opacity : 1,
duration : 1800
});
setTimeout(function(e) {
splash.close(fadeOut);
topWin.open(fadeIn);
}, 3000);
It works as I mean however I think this way might be a bit strange.
Since
I have to decide the each image according to different resolution devices(iphone/ipad/android ,,) by manual while splash screen is chosen automatically.
Is there a good way other than this??
Take a look at this:
http://www.tidev.io/2015/01/06/how-to-re-use-the-launch-image-in-the-app/
I haven't done this in a while, and I'm not sure if the changes to 5.2 SDK for iOS for Storyboard launch files breaks this method but here's where I'd start.

Titanium Appcelerator Video Player Back Button on Android

I am new to Titanium App Development. I am making a title list of videos using a ListView. When I click on an item, the specific video plays fine. However when I press the back button in Android, the application exits instead of going back to the previous list of videos. I have tried android:back and androidback event of the window but still the same. How should I fix this??? By the way I am using the Alloy Framework in Titanium
index.js
videos.fetch({query: 'select * from '+ videos.config.adapter.collection_name + ' where video_id = '+ vid_id});
var args;
for (var vd=0 ; vd < videos.length; vd++){
var e = JSON.parse(JSON.stringify(videos.at(vd)));
args = {
parent_id : lsn_sub,
video_data : e.video_data
};
console.log(args.video_data);
var mediaview = Alloy.createController("media", args).getView();
mediaview.open();
media.js
var parent_view = args.parent_id;
var vid_media = args.video_data;
console.log("parent source: "+parent_view);
console.log($.vid_media.url);
$.vid_media.url = vid_media ;
$.media.addEventListener('androidback', function(e){
alert("android back");
});
views/media.xml
<Alloy>
<Window class="container">
<VideoPlayer id="vid_media" ns="Ti.Media" ></VideoPlayer>
</Window>
The back button exits the application, not going back to previous screen.
Set the model property of your second window true.
<SecondWindow class="container" modal="true"></SecondWindow>
Also set modal and exitOnClose true on your first window if you want to close the app when user press android back on your first screen.
<FirstWindow class="container" modal="true" exitOnClose></FirstWindow >
there is no to add android:back event for it.
Hope this will help you
Thank you for the great help #suraj and #victor, but I figured it out already.
The reason for it to be not working is because I was testing it only in the simulator, not on a real device. When I run it on the real device, the 'back button' of the android actually works fine. It stops my video and goes back to the previous screen.
We should really test on a real device rather than relying on a simulator. Have a great day! :)
Another possible solution
is to cancel the bubbling effect of the androidback event,
$.media.addEventListener('androidback', function(e) {
e.cancelBubble = true;
[...Your logic here...]
}

Retina Images not being loaded on sencha touch

I've included retina.js in my Sencha Touch application. When watching the network monitor I see
retina.js is loaded
images are loaded normaly example.jpg
no #2x images are loaded example#2x.jpg or even looked for
Using chrome to emulate an iphone this is all I see
I also manually ran Retina.init(window) however nothing happens. All images remain non-retina. Running Retina.isRetina() returns true
I don't actually own a retina device, so I am not sure if that is the issue. However my friend with an iPhone 5s says the image quality has not improved, so I am assuming the retina images are not showing up.
The documentation is not very helpful
I figure this has to do with the fact that images are created and loaded with JS (the images are not there onload)
Using chrome for debugging, how can I make retina.js work for my app?
OK, so I used a small part of the retina.js file and created a new class, it uses the isRetina function to tell weather the devicePixelRatio is higher than 1.
Ext.define('MyApp.Retina', {
singleton: true,
isRetina : function(){
var mediaQuery = "(-webkit-min-device-pixel-ratio: 1.5),\
(min--moz-device-pixel-ratio: 1.5),\
(-o-min-device-pixel-ratio: 3/2),\
(min-resolution: 1.5dppx)";
if (window.devicePixelRatio > 1)
return true;
if (window.matchMedia && window.matchMedia(mediaQuery).matches)
return true;
return false;
},
getSrc: function(url){
return this.isRetina()? [url.slice(0, -4), '#2x', url.slice(-4)].join(''): url;
}
});
Now throughout my sencha app I create images with MyApp.Retina.('http://example.com/foo.jpg') as src value, when the device is retina the function returns http://example.com/foo#2x.jpg