King of Glory Map Integration: UI Framework, Method Calls, and Cross‑Platform Event Handling

This article presents a comprehensive technical solution for integrating the King of Glory (王者荣耀) map into a Unity‑based game. It describes the overall architecture, UI framework design, data transmission, method invocation, and event callback mechanisms across Android, iOS, and Unity.

Project Background

The map is a core LBS feature for the game. The goal is to provide a lightweight 2D map solution that meets strict package size constraints while supporting UI elements such as POI ranking, city ranking, and location services.

Technical Solution Evolution

Two Android implementation options were evaluated: launching a new Activity, using WindowManager, or attaching a native View to the Unity Activity. The third option (native View mounting) was chosen.

public class UnityPlayerNativeActivity extends NativeActivity { protected UnityPlayer mUnityPlayer; @Override protected void onCreate(Bundle savedInstanceState) { requestWindowFeature(Window.FEATURE_NO_TITLE); super.onCreate(savedInstanceState); getWindow().takeSurface(null); setTheme(android.R.style.Theme_NoTitleBar_Fullscreen); getWindow().setFormat(PixelFormat.RGB_565); mUnityPlayer = new UnityPlayer(this); if (mUnityPlayer.getSettings().getBoolean("hide_status_bar", true)) getWindow().setFlags(WindowManager.LayoutParams.FLAG_FULLSCREEN, WindowManager.LayoutParams.FLAG_FULLSCREEN); setContentView(mUnityPlayer); mUnityPlayer.requestFocus(); } // ... }

Mounting the native View onto the Unity window:

ViewGroup rootView = (ViewGroup) activity.getWindow().getDecorView(); ViewGroup.LayoutParams param = new ViewGroup.LayoutParams(ViewGroup.LayoutParams.MATCH_PARENT, ViewGroup.LayoutParams.MATCH_PARENT); rootView.addView(mView, param);

UI Framework Design

The framework consists of three layers: Scene, Page, and View. Various view controls (Label, Button, ImageView, MapView, TableView, LoadingView, TextBox, etc.) are defined with common properties such as id, rect, zIndex, invisible, and backgroundColor.

Example JCE definition for a label:

struct UKLabel { 0 require UKInt id; // unique identifier 1 optional UKInt zIndex; 2 require UKRect rect; // position and size 3 optional UKBool invisible; 4 optional UKColor backgroundColor; 5 optional UKString text; 6 optional UKColor textColor; 7 optional UKColor highlightedTextColor; 8 optional UKFont font; 9 optional UKTextAlignment textAlignment; 10 optional UKEllipsis ellipsis; }

Method Invocation

Method calls are encoded as data: the target object id, method name, and parameters. The Android side provides a generic interface to receive calls:

public void call(byte[] target, byte[] method);

Example of a method to set text on a label:

public void setText(UKString text) { if (text != null) { setText(text.getval()); } }

Event Callback

Callbacks are sent back to Unity with a target description and event data. Example callback target definition:

struct UKCallbackTarget { 0 require UKInt targetID; // view id 1 require UKTargetType targetType; // e.g., Button, TableView 2 require UKCallbackType callbackType; // click, state change, etc. }

Example of a TableView click event data:

struct UKTableViewCallbackData_Clicked { 0 require UKInt idx; // clicked item index }

Callback interface on Android:

public void callback(byte[] target, byte[] data);

Android Coordinate System Alignment

The game UI is designed for a 1280×720 coordinate system, while Android devices report physical pixels (e.g., 2560×1440). A simple scaling factor aligns the two systems, ensuring UI elements appear at the correct positions.

Android Click Event Handling

To forward Unity touch events to Android, the following meta‑data is added to AndroidManifest.xml :

<meta-data android:name="android.app.lib_name" android:value="unity"/> <meta-data android:name="unityplayer.ForwardNativeEventsToDalvik" android:value="true"/>

A transparent overlay is added in Unity to prevent Unity from consuming the click, allowing Android to receive it.

Immersive Mode on Android

Immersive full‑screen mode is enabled in onWindowFocusChanged :

if (hasFocus && Build.VERSION.SDK_INT >= 19) { View decorView = getWindow().getDecorView(); decorView.setSystemUiVisibility( View.SYSTEM_UI_FLAG_LAYOUT_STABLE | View.SYSTEM_UI_FLAG_LAYOUT_HIDE_NAVIGATION | View.SYSTEM_UI_FLAG_LAYOUT_FULLSCREEN | View.SYSTEM_UI_FLAG_HIDE_NAVIGATION | View.SYSTEM_UI_FLAG_FULLSCREEN | View.SYSTEM_UI_FLAG_IMMERSIVE_STICKY); }

Android Nine‑Patch (9‑Patch) Support

The article explains how to construct a NinePatchChunk manually and use it with NinePatchDrawable . The key steps are creating a byte buffer with the stretch regions and padding, then creating the drawable:

float density = context.getResources().getDisplayMetrics().density; Bitmap scaledBitmap = Bitmap.createScaledBitmap(bitmap, (int)(bitmap.getWidth() * density), (int)(bitmap.getHeight() * density), true); ByteBuffer buffer = getByteBufferFixed((int)(top * density), (int)(left * density), (int)(bottom * density), (int)(right * density)); NinePatchDrawable drawable = new NinePatchDrawable(context.getResources(), scaledBitmap, buffer.array(), new Rect(), null);

After applying the correct density scaling, the NinePatch renders correctly without missing edges.

Debug and Integration Optimization

To speed up debugging, the team introduced a data‑driven approach: Unity generates JCE data describing UI layout, which Android/iOS can render directly without rebuilding the whole app. This enables rapid iteration by loading binary UI descriptions on a test device.

Conclusion

The project delivered a cross‑platform UI framework that integrates a lightweight map into Unity, handling method calls, event callbacks, coordinate conversion, immersive mode, and NinePatch rendering. The data‑driven architecture and debugging workflow significantly reduced integration time from hours to minutes.