leftImage and rightImage property of TableViewRow ain't working with remote pictures
Reported by Nicolai C. Nielsen | April 16th, 2011 @ 05:04 PM
When I set the leftImage and rightImage property to a remote picture (ex: leftImage: "http://www.google.com/ig/images/weather/sunny.gif") it won't show the picture.
Though when I change the SDK version of my mobile project to 1.2.0 it works ?
The 1.6.0 and 1.6.1 SDK ain't showing the remote pictures.
This code is from the example "Using TableViews" on the wiki page.
The app example pictures in the tutorial shows the pictures just fine, but with newer SDK's it doesn't.
var defaultColor = "#035385";
var window = Titanium.UI.createWindow({
backgroundColor:'#999'
});
var weatherData = [
{ title: "Mountain View (North America)\nCloudy", leftImage: "http://www.google.com/ig/images/weather/cloudy.gif" },
{ title: "Washington, DC (North America)\nMostly Cloudy", leftImage: "http://www.google.com/ig/images/weather/mostly_cloudy.gif" },
{ title: "Brasilia (South America)\nThunderstorm", leftImage: "http://www.google.com/ig/images/weather/thunderstorm.gif" },
{ title: "Buenos Aires (South America)\nClear", leftImage: "http://www.google.com/ig/images/weather/sunny.gif" },
{ title: "Sucre (South America)\nMostly Cloudy", leftImage: "http://www.google.com/ig/images/weather/mostly_cloudy.gif" },
{ title: "London (Europe)\nOvercast", leftImage: "http://www.google.com/ig/images/weather/cloudy.gif" },
{ title: "Moscow (Europe)\nPartly Cloudy", leftImage: "http://www.google.com/ig/images/weather/partly_cloudy.gif" },
{ title: "Prague (Europe)\nClear", leftImage: "http://www.google.com/ig/images/weather/sunny.gif" },
{ title: "St Petersburg (Europe)\nSnow", leftImage: "http://www.google.com/ig/images/weather/snow.gif" },
];
// Row styling properties
for(var i=0, ilen=weatherData.length; i<ilen; i++){
var thisObject = weatherData[i];
thisObject.backgroundImage = "images/tableviewrow-bg.png";
thisObject.color = defaultColor;
thisObject.backgroundSelectedImage = "images/tableviewrow-bg-selected.png";
thisObject.selectedColor = "black";
thisObject.height = 75;
}
var headerLabel = Ti.UI.createLabel({
backgroundColor:defaultColor,
color:"white",
font:{ fontSize: 16, fontWeight:"bold" },
text:"The Weather App",
textAlign:"center",
height:35,
width:320
});
var footerLabel = Ti.UI.createLabel({
backgroundColor:defaultColor,
color:"white",
font:{ fontSize:10 },
text:"[data and icons supplied by Google Weather API]",
textAlign:"center",
height:25,
width:320
});
var table = Ti.UI.createTableView({
backgroundColor:"white",
data: weatherData,
headerView:headerLabel,
footerView:footerLabel,
separatorColor:"white",
top:10,
width:320
});
window.add(table);
window.open();
Comments and changes to this ticket
-

Tom May 3rd, 2011 @ 04:03 AM
Hi.
There seems to be a way to do this without using leftImage (which does not work for me too).
When you create your rows, add then a Titanium.UI.createImageView. Such as something like this :var tableData = [];
// Row styling properties for(var i=0, ilen=arrData.length; i<ilen; i++){ var thisObject = arrData[i]; thisObject.indentionLevel = 2; // To indent the text so the image shoes well var myRow = Titanium.UI.createTableViewRow(thisObject); var myImageView = Titanium.UI.createImageView({ image:thisObject.image, width:'25', height:'25', left:0 }); myRow(myImageView); tableData.push(ligne); } var table = Titanium.UI.createTableView({ backgroundColor:"white", data:tableData, top:10, width:"500" });
Please Sign in or create a free account to add a new ticket.
With your very own profile, you can contribute to projects, track your activity, watch tickets, receive and update tickets through your email and much more.
Create your profile
Help contribute to this project by taking a few moments to create your personal profile. Create your profile »