Issue: Display hidden components in Viewer" Checkbox Not Working on Screens Other Than Screen1

Open Source Development
1

Hey everyone,

I'm facing an issue in MIT App Inventor related to the "Display hidden components in Viewer" checkbox. Here’s a step-by-step breakdown of the problem:

  1. At the top of the Viewer, there's a checkbox labeled "Display hidden components in Viewer."
  2. When I check this box, any component that has VISIBLE=false (i.e., hidden) becomes visible again in the Viewer. This works correctly for Screen1—hidden components are properly shown when the checkbox is checked.
  3. However, when I create additional screens (e.g., Screen2, Screen3, etc.), the checkbox does not reveal hidden components on those screens. It seems like the checkbox functionality is only working for Screen1.

Debugging Observations

I've been investigating the issue and adding logs to understand what's happening. Here’s what I’ve found:

1. shouldDisplayHiddenComponents() Method

This function determines whether hidden components should be displayed.

  • It correctly returns true or false for Screen1 when the checkbox is toggled.
  • However, for any other screen, it always returns null, which suggests the checkbox state is not being tracked properly for additional screens.
public boolean shouldDisplayHiddenComponents() {
   String formTitle = form.getTitle();
   Boolean checkboxState = projectEditor.getScreenCheckboxState(formTitle);

   LOG.info("Checking if hidden components should be displayed for screen: " + formTitle);
   LOG.info("Checkbox state for screen " + formTitle + ": " + checkboxState);

   return checkboxState != null && checkboxState;
}

2. getScreenCheckboxState(String screen) Method

This function retrieves the checkbox state for a given screen.

  • The logs confirm that this function is called for all screens, meaning it is properly triggered.
public final Boolean getScreenCheckboxState(String screen) {
    LOG.info("getScreenCheckboxState called with screen: " + screen);

    if (screenHashMap.size() == 0) {
      LOG.info("screenHashMap is empty, calling buildScreenHashMap()");
      buildScreenHashMap();
    } else {
      LOG.info("screenHashMap already populated");
    }

    Boolean state = screenHashMap.get(screen);
    LOG.info("Returning checkbox state for screen " + screen + ": " + state);
    
    return state;
}

3. toggleHiddenComponents(ClickEvent e) Method

This function should be called whenever the checkbox is clicked.

  • It is only called for Screen1 and never for other screens, which likely explains why the checkbox doesn't work for additional screens.
public static void toggleHiddenComponents(ClickEvent e) {
    LOG.info("Received checkbox click"); // I see this log only for Screen1

    if (INSTANCE.form != null) {
      LOG.info("Updating hidden components");
      Ode.getCurrentProjectEditor().setScreenCheckboxState(INSTANCE.form.getTitle(), INSTANCE.getValue());
      INSTANCE.form.doRefresh();
    }
}

4. setScreenCheckboxState(String screen, Boolean isChecked) Method

This function should update the checkbox state for a screen.

  • It never gets called for any screen, including Screen1, which may indicate why the state is not being properly stored.
public final void setScreenCheckboxState(String screen, Boolean isChecked) {
    LOG.info("Not Working"); // This log never appears
    LOG.info("setScreenCheckboxState called with screen: " + screen + " isChecked: " + isChecked);
    
    screenHashMap.put(screen, isChecked);
    changeProjectSettingsProperty(
        SettingsConstants.PROJECT_YOUNG_ANDROID_SETTINGS,
        SettingsConstants.YOUNG_ANDROID_SETTINGS_SCREEN_CHECKBOX_STATE_MAP,
        getScreenCheckboxMapString()
    );
}

Summary of the Issue

  • Checkbox works correctly for Screen1 but not for any additional screens.
  • shouldDisplayHiddenComponents() returns null for other screens.
  • getScreenCheckboxState() is being called for all screens.
  • toggleHiddenComponents(ClickEvent e) is only triggered for Screen1, which suggests that checkbox clicks on other screens are not properly registered.
  • setScreenCheckboxState() is never called, meaning the state might not be stored or updated for new screens.

What I Need Help With

  1. Why is the checkbox state not being tracked for additional screens?
  2. Why is toggleHiddenComponents() only called for Screen1 and not for other screens?
  3. How can I fix this so that hidden components can be shown on all screens when the checkbox is checked, not just Screen1?

I appreciate any guidance on how to solve this. Thanks in advance! :blush:

2

It's possible this is an oversight. Before the UI refactor, each screen had its own copy of that checkbox and they had to coordinate its state via the project properties. I think @Susan_Lane was trying to avoid that additional coordination by making it a singleton.

Looking at the potential callers, this should always be called when the checkbox state is changed by the user. Can you confirm that you are NOT seeing this behavior?

Because it was made into a singleton, presumably the switching of screens reattaches the component to a new spot in the DOM hierarchy. My working theory is that be detaching and reattaching, it could be possible the event handler is lost, which would definitely contribute to the described bug.

1 Like
3

Thank you so much, @ewpatton! With your help, I was able to resolve this issue and learned a lot along the way. :slightly_smiling_face:

For my approach, I decided to ditch the idea of a single checkbox entirely. Instead, I’m giving each screen its own checkbox and using a manager to handle the logic. This way, there’s no risk of losing connections when switching between screens.

Please review my changes here: LINK of PR.

4

This topic was automatically closed 7 days after the last reply. New replies are no longer allowed.