<Alloy>
<TabGroup>
<Tab title="Window backgroundImage">
<Window backgroundImage="images/img-cover.jpg" backgroundRepeat="true">
</Window>
</Tab>
<Tab title="View backgroundImage">
<Window>
<View backgroundImage="images/img-cover.jpg" backgroundRepeat="true">
</View>
</Window>
</Tab>
</TabGroup>
</Alloy>
ImageView Test Case:
<Alloy>
<TabGroup>
<Tab title="Window">
<Window title="Window" backgroundImage="appicon.png">
<Label color="green">Window: 'appicon.png' is shown as background image.</Label>
</Window>
</Tab>
<Tab title="View">
<Window title="View">
<View backgroundImage="appicon.png">
<Label color="red">View: 'appicon.png' is NOT shown background image.</Label>
</View>
</Window>
</Tab>
<Tab title="ImageView">
<Window title="ImageView">
<Label color="red">Window: ImageView is NOT shown.</Label>
<ImageView image="appicon.png">
<Label color="red">ImageView: 'appicon.png' is NOT shown.</Label>
</ImageView>
</Window>
</Tab>
<Tab title="ImageView">
<Window title="ImageView">
<Label color="red">Window: ImageView is NOT shown.</Label>
<ImageView backgroundImage="appicon.png">
<Label color="red">ImageView: 'appicon.png' is NOT shown background image.</Label>
</ImageView>
</Window>
</Tab>
</TabGroup>
</Alloy>
Moving this ticket to engineering as I can reproduce this issue with Android platform. Works fine on iOS platform.
Same issue exists for ImageView as well so I have added another test case in the description to show that issue.
Are you going to fix this? Don't you think the issue is critical? *ImageView* is completely useless now. Could you suggest a workaround or something, plz?
I was able to reproduce the issue & I have few findings: 1. I think this is an alloy issue for a classic app I don't see any issues. 2. My test code for alloy:
<Alloy> <TabGroup> <Tab title="Window backgroundImage"> <Window backgroundImage="MarketplaceArtwork.png" backgroundRepeat="true"> </Window> </Tab> <Tab title="View backgroundImage"> <Window> <View backgroundImage="/MarketplaceArtwork.png" backgroundRepeat="true"/> <!-- <View backgroundRepeat="true"/> --> </Window> </Tab> <Tab title="ImageView"> <Window title="ImageView"> <ImageView backgroundImage="/MarketplaceArtwork.png" backgroundRepeat="true"/> </Window> </Tab> </TabGroup> </Alloy>From Feon: TIMOB-16983 – I don't think it's an Alloy issue. I looked at the generated code and also ported the Alloy test app to a classic Titanium app (https://github.com/feons/alloy/tree/TIMOB-16983-testapp/test/apps/testing/TIMOB-16983). Here's the output from running the classical app on Ti SDK 3.3.0 Alpha: For Note 10.1 Android version 4.3 1. Window backgroundImage shows with or without the leading slash in the image filename 2. View backgroundImage doesn't show without the leading slash in the image filename 3. View backgroundImage shows with the leading slash in the image filename 4. ImageView backgroundImage doesn't show at all with or without the leading slash in the image filename For iOS 1. Window backgroundImage shows with or without the leading slash in the image filename 2. View backgroundImage shows with or without the leading slash in the image filename 3. ImageView backgroundImage doesn't show at all with or without the leading slash in the image filename
Verified the behaviour seen Feon on a classic app. Environment: Appc Studio : 3.3.0.201405271647 Ti SDK : 3.3.0.v20140605125743 Mac OSX : 10.8.5 Alloy : 1.4.0-beta2 CLI - 3.3.0-beta2 Code Processor: 1.1.1 Nexus 5 - android 4.4.2
I have investigated this issue and there are two problems: 1. The path for windows creation is absolute (root always at Resources/ directory) while the path for views is relative. So for the example https://github.com/feons/alloy/tree/TIMOB-16983-testapp/test/apps/testing/TIMOB-16983, since our view is created in the file that is located in ui/window, backgroundImage: 'appicon.png' essentially means 'ui/window/appicon.png'. This is why backgroundImage of view isn't showing up. Simply modify the location to '../../appicon.png' for it to work. 2. backgroundImage has never worked for ImageView (I've tested back to 3.2.0.GA). After looking at the code, I suspect the problem is that ImageView has its own custom layout and controls.
The Sprint 11 SDK ended almost a month ago. How about to fix the bug, please? Don't you think it's a critical issue? Could you suggest a workaround at least?
[~fixplease] I've added comments from one of our developers that reviewed the issue, including a suggested workaround for the first. Please review and let us know your thoughts.
Hi I can confirm that the "../../appicon.png" trick works indeed. But my thoughts are as usual - bugs need to be fixed. And I can't understand why it takes too long to fix such relatively simple things.
[~hpham] to investigate possible fixes for this in Sprint 16. Need to check parity with iOS.
Closing the ticket because couldn't reproduce with the following code. Set backgroundImage code to imageView
doesn't work on both Android and iOS. Please useinstead.// this sets the background color of the master UIView (when there are no windows/tab groups on it) Titanium.UI.setBackgroundColor('#000'); // create tab group var tabGroup = Titanium.UI.createTabGroup(); // // create tab 1 // var win1 = Titanium.UI.createWindow({ title:'Tab 1', backgroundColor:'#fff' }); var tab1 = Titanium.UI.createTab({ icon:'KS_nav_views.png', title:'Tab 1 - View', window:win1 }); var view = Titanium.UI.createView({ backgroundImage:'pattern.jpg', backgroundRepeat:'true' }); win1.add(view); // // create tab 2 // var win2 = Titanium.UI.createWindow({ title:'Tab2 - ImageView', backgroundColor:'#fff' }); var tab2 = Titanium.UI.createTab({ icon:'KS_nav_ui.png', title:'Tab2 - ImageView', window:win2 }); var imageView = Titanium.UI.createImageView({ image:'pattern.jpg', backgroundRepeat:'true' }); win2.add(imageView); // // create Tab 3 // var win3 = Titanium.UI.createWindow({ title:'Tab3 - Window', backgroundImage:'pattern.jpg', backgroundRepeat:'true' }); var tab3 = Titanium.UI.createTab({ icon:'KS_nav_ui.png', title:'Tab3 - Window', window:win3 }); // // add tabs // tabGroup.addTab(tab1); tabGroup.addTab(tab2); tabGroup.addTab(tab3); // open tab group tabGroup.open();