Uploaded image for project: 'Titanium SDK/CLI'
  1. Titanium SDK/CLI
  2. TIMOB-27249

Android: OptionDialog without radio buttons should not auto-set "selectedIndex" property after clicking option

    Details

    • Story Points:
      5
    • Sprint:
      2019 Sprint 17

      Description

      Summary:
      As of Titanium 8.1.0, Android now supports displaying an OptionDialog without radio buttons if its "selectedIndex" property is not set (or set to -1). See: TIMOB-26793

      But one usability issue with the current implementation is that tapping on an OptionDialog button causes the "selectedIndex" to be set to the index of the tapped button. The issue with this is if the OptionDialog is re-shown, it'll show radio buttons instead of plain buttons which is not desired. This happens because the "selectedIndex" was set.

      Proposed Solution:
      If the OptionDialog is not showing radio buttons, then it should not automatically set the "selectedIndex" property when tapping a button. The "click" event already provides the index of the button that was tapped on and this is enough. Besides, iOS does not support the "selectedIndex" property anyways, making this behavior portable.

      However, if the developer does set "selectedIndex" via code to show radio buttons, then the OptionDialog should maintain the old behavior and update the "selectedIndex" property with the clicked button index.

      Steps to reproduce:

      1. Build and run the below code on Android.
      2. Tap on the "Show Dialog" button.
      3. Tap on the dialog's "Option 1" button.
      4. Tap on the "Show Dialog" button again to re-show it.
      5. Notice the dialog shows radio buttons in front of every option button. (This is the usability issue.)

      var dialog = Ti.UI.createOptionDialog({
      	title: "Option Dialog",
      	options: ["Option 1", "Option 2", "Cancel"],
      	cancel: 2,
      });
      dialog.addEventListener("click", function(e) {
      	Ti.API.info("@@@ Dialog 'click' index: " + e.index + ", button: " + e.button + ", cancel: " + e.cancel);
      });
      dialog.addEventListener("cancel", function(e) {
      	Ti.API.info("@@@ Dialog 'cancel'");
      });
       
      var window = Ti.UI.createWindow();
      var button = Ti.UI.createButton({ title: "Show Dialog" });
      button.addEventListener("click", function(e) {
      	dialog.show();
      });
      window.add(button);
      window.open();
      

      Work-around:
      Set "selectedIndex" to -1 before re-showing the dialog.

      dialog.selectedIndex = -1;
      dialog.show();
      

        Attachments

          Activity

            People

            • Assignee:
              ybanev Yordan Banev
              Reporter:
              jquick Joshua Quick
              Reviewer:
              Joshua Quick
              Tester:
              Keerthi Mahalingam (Inactive)
            • Watchers:
              6 Start watching this issue

              Dates

              • Created:
                Updated:
                Resolved:

                Backbone Issue Sync

                • Backbone Issue Sync is enabled for your project, but we do not have any synchronization info for this issue.

                  Git Source Code