Titanium JIRA Archive
Alloy (ALOY)

[ALOY-727] Alloy: OptionDialog androidView not showing up

GitHub Issuen/a
TypeBug
PriorityMedium
StatusClosed
ResolutionFixed
Resolution Date2014-01-22T20:29:34.000+0000
Affected Version/sn/a
Fix Version/sAlloy 1.4.0
ComponentsTitanium SDK
Labelsalloy, android, optiondialog, qe-testadded
ReporterMads Moller
AssigneeTony Lukasavage
Created2013-05-22T17:18:24.000+0000
Updated2014-05-08T23:47:43.000+0000

Description

The customView (androidView property) of an OptionDialog, does not work as expected. The content does not show when it is added through the controller. The following does not work: (custom view inside OptionDialog tag) where 
<OptionDialog id="dialogView" platform="android" >
		<View id="container" class="VerticalView">
			<Label id="name"></Label>
			<Label id="address"></Label>
			<Label id="zip"></Label>
			<Label id="city"></Label>
			<Label id="phone"></Label>
			<Label id="mail"></Label>
		</View>
	</OptionDialog>	

$.name.text = Alloy.language.Name+": " + company.CompanyName;
$.address.text = Alloy.language.Address+": " + company.CompanyAddress;
$.zip.text = Alloy.language.ZipCode+": " + company.CompanyZipCode;
$.city.text = Alloy.language.City+": " + company.CompanyCity;
$.phone.text = Alloy.language.Phone+": " + company.CompanyPhone;
$.mail.text = Alloy.language.Email+": " + company.CompanyEmail;
The following do work: (here I add the androidView manually through the controller) 
<OptionDialog id="dialogView" platform="android" />

<View id="container" class="VerticalView" platform="android">
	<Label id="name"></Label>
	<Label id="address"></Label>
	<Label id="zip"></Label>
	<Label id="city"></Label>
	<Label id="phone"></Label>
	<Label id="mail"></Label>
</View>

$.name.text = Alloy.language.Name+": " + company.CompanyName;
$.address.text = Alloy.language.Address+": " + company.CompanyAddress;
$.zip.text = Alloy.language.ZipCode+": " + company.CompanyZipCode;
$.city.text = Alloy.language.City+": " + company.CompanyCity;
$.phone.text = Alloy.language.Phone+": " + company.CompanyPhone;
$.mail.text = Alloy.language.Email+": " + company.CompanyEmail;

if(OS_ANDROID){
	//manually set the androidView property
	$.dialogView.androidView = $.containerView;
	$.dialogView.show();
}

Comments

  1. Daniel Sefton 2013-05-22

    Hi Mads, Please could you either attach a project which reproduces the problem, or organise your code snippets to be complete for us to drop into a new project and run? Thanks!
  2. Shak Hossain 2013-06-27

    Hi Tony, Moving this ti Alloy for your feedback. Even though Daniel asked for a test case, we have yet to receive it. However, the reporter is a well-known titan and I am under the impression that the issue is valid. Leaving it upto to you. Thanks, Shak
  3. Mostafizur Rahman 2013-12-08

    Hello, I tested this issue the test code below. I was able to reproduce the problem. It does occur when I try to update android View content from controller.

    Test Environment:

    OS: MAC OS X 10.8.5 Ti SDK: 3.1.3 GA, 3.2.0.x Ti CLI: 3.3.0 Alloy 1.2.2, 1.3.0-beta Android Device Android SDK 2.3.3, 4.2.2

    Test Code

    *index.xml* 
       <Alloy>
   	<Window>
   
   		<OptionDialog id="options" title="App Options" destructive="3" cancel="2">
   			<ButtonNames>
   				<ButtonName>button 1</ButtonName>
   				<ButtonName>button 2</ButtonName>
   			</ButtonNames>
   			<View  id= "androidView"layout="horizontal" platform="android">
   				<Label id="avLabel"/>
   			</View>
   		</OptionDialog>
   		<Button onClick="showOptions">options</Button>
   	</Window>
   </Alloy>
    *index.js* 
       function showOptions(e) {
   	$.options.show();
   }
   
   $.avLabel.text = 'This is an androidView';
   
   $.index.open();
    *index.tss* 
       "Window": {
           backgroundColor: '#fff'
   },
   "Button": {
           height: Ti.UI.SIZE,
           width: Ti.UI.SIZE
   }, 
   "#avLabel": {
           color: '#fff',
           left: '20dp',
           height: Ti.UI.SIZE,
           width: Ti.UI.SIZE,
           textAlign: 'center',
           font: {
                   fontSize: '16dp'
           }
   }

    Step to test

    Create a new alloy project

    Paste test code in index.js/ index.xml/ index.tss

    Now run on android device/Emulator

    Click on button, it will display blank option dialog with two buttons

    Actual result

    “This is an androidView” will display in OptionDialog
  4. Tim Poulsen 2014-01-21

    I am seeing the behavior described in the ticket, but the problem is not as indicated. The View and Label are present, however the generated controller does not have a variable $.avLabel, so the assignment in index.js does nothing. In other words, change the Label tag to the following and the app works as written (though I added a space added between "androidView"layout).
  5. Tony Lukasavage 2014-01-22

    PR: https://github.com/appcelerator/alloy/pull/309 test app: https://github.com/appcelerator/alloy/tree/master/test/apps/testing/ALOY-727

    functional test

    Run the test app for android

    Click the "options" button

    Assert that the OptionDialog that pops up has 2 buttons and has a label in it that contains the phrase "This is an androidView". Make sure it does *not* have the phrase "This is a label".

    Inspect the generated code in "Resources/android/alloy/controllers/index.js" and make sure that the views for both *androidView* and *avLabel* are generated only once.

    Prior to this fix, the label in step #3 would say "This is a label" and the *androidView* and *avLabel* views would have been generated twice in the controller.
  6. Lokesh Choudhary 2014-05-08

    Verified the fix. We see expected results as mentioned by [~tlukasavage] in his comments for verification of the fix. Closing. Environment: Appc Studio : 3.3.0.201405011408 Ti SDK : 3.3.0.v20140508101423 Mac OSX : 10.8.5 Alloy : 1.4.0-dev CLI - 3.3.0-dev Nexus 5 - android 4.4.2

JSON Source