How to draw android UI Elements on top of GL in NDK project

Issue

I have an NDK project and I am using opengl for rendering. I am handling this all from c++. I have also been able to use jni to create an android.widget.Button and hook up its callbacks. When I press the screen the callback fires so I know I have a valid UI Element.

The issue is that the button is not visible. I'm assuming that it is being hidden by GL. I need some way of drawing the UI on top GL.

As GL in ndk doesn't have a glsurfaceview I can't just stick it and the button in some android Layout and let it handle the issue.

Any thoughts?

Solution

I found the solution here but I have copied the important points here. Massive thanks to mkandula for his great explanation

1. Create a GUIActivity class which will handle interactions and will either use them or pass them to the underlying AppInterface class

   public class GUIActivity extends Activity
   

2. In your main activity's onCreate method create the GUIActivity

   // Inside AppInterface
   @Override
   protected void onCreate(Bundle savedInstanceState) {
       super.onCreate(savedInstanceState);
       context = this.getApplication().getApplicationContext();
       Intent startNewActivityOpen = new Intent(this, GUIActivity.class);
       startActivity(startNewActivityOpen);
   }
   

3. Add the new Activity to your manifest

   <activity android:name="GUIActivity"
             android:label="GUIActivity"
             android:theme="@style/Theme.Transparent"
             android:configChanges="orientation|keyboardHidden|screenSize|smallestScreenSize">
   </activity>
   

4. Add a transparent theme to your project under res/values/styles.xml

   <?xml version="1.0" encoding="utf-8"?>
   <resources>
     <style name="Theme.Transparent" parent="android:Theme">
       <item name="android:windowIsTranslucent">true</item>
       <item name="android:windowBackground">@android:color/transparent</item>
       <item name="android:windowContentOverlay">@null</item>
       <item name="android:windowNoTitle">true</item>
       <item name="android:windowIsFloating">true</item>
       <item name="android:backgroundDimEnabled">false</item>
     </style>
   </resources>
   

This will get you to the point where you have a transparent activity over your native one without having to change any of how the native code works.

You may want to pass down touch events and such mkandula recommends using the following. I haven't tested this yet but I have no doubt it works given the rest of his answer was spot on.

@Override
public boolean onTouchEvent(MotionEvent ev) {
    if (isViewInGameMode == true) {
        if (ev.getAction() == MotionEvent.ACTION_DOWN)
            AppInterface.OnTouchStart(ev.getX(), ev.getY());
        else if (ev.getAction() == MotionEvent.ACTION_MOVE)
            AppInterface.OnTouchUpdate(ev.getX(), ev.getY());
        else if (ev.getAction() == MotionEvent.ACTION_UP)
            AppInterface.OnTouchEnd(ev.getX(), ev.getY());
        else {
            System.out.println("action " + ev.getAction()
                               + " unaccounted for in OnTouchEvent");
        }
    }
    return super.onTouchEvent(ev);
}

Answered By - Baggers