[Android] Chapter 3 (25) Example 24--OpenGL drawing function

Category: C#, Android, VS2015, Baidu Map Application; Creation Date: 2016-02-04 1. Introduction Baidu Map SDK opens the OpenGL drawing interface to developers to help developers implement more flexible styles on maps Draw and enrich the experience of using maps. 2. Running screenshot Introduction: Introducing how to use OpenGL to implement custom drawing on the map

Category: C#, Android, VS2015, Baidu map application; Creation date: 2016-02-04

1. Introduction

Baidu Map SDK opens up the OpenGL drawing interface to developers, helping developers achieve more flexible style drawing on maps and enriching the experience of using maps.

2. Running screenshots

Introduction: Introducing how to use OpenGL to implement custom drawing on the map.

Details:

(1) Use OpenGL to draw basic polylines;

(2) Use OpenGL to draw textures on the map;

The screenshot of this example running is as follows:

3. Design steps

1. Add demo24_opengl.xml file

Add this file under the layout folder, and then change the code to the following:

<span style="color: #0000ff;"></span><span style="color: #ff00ff;">xml version="1.0" encoding="utf-8"</span><span style="color: #0000ff;">?></span>
<span style="color: #0000ff;"><span style="color: #800000;">RelativeLayout </span><span style="color: #ff0000;">xmlns:android</span><span style="color: #0000ff;">="http://schemas.android.com/apk/res/android"</span><span style="color: #ff0000;">
    android:layout_width</span><span style="color: #0000ff;">="fill_parent"</span><span style="color: #ff0000;">
    android:layout_height</span><span style="color: #0000ff;">="fill_parent"</span><span style="color: #ff0000;">
    android:orientation</span><span style="color: #0000ff;">="vertical"</span> <span style="color: #0000ff;">></span>
  <span style="color: #0000ff;"><span style="color: #800000;">com.baidu.mapapi.map.TextureMapView
      </span><span style="color: #ff0000;">android:id</span><span style="color: #0000ff;">="@+id/bmapView"</span><span style="color: #ff0000;">
      android:layout_width</span><span style="color: #0000ff;">="match_parent"</span><span style="color: #ff0000;">
      android:layout_height</span><span style="color: #0000ff;">="fill_parent"</span> <span style="color: #0000ff;">/></span>
<span style="color: #0000ff;"></span><span style="color: #800000;">RelativeLayout</span><span style="color: #0000ff;">></span></span></span>

2. Add the Demo24OpenGL.cs file

Add this file under the SrcSdkDemos folder, and then change the code to the following:

<span style="color: #0000ff;">using</span><span style="color: #000000;"> Android.App;
</span><span style="color: #0000ff;">using</span><span style="color: #000000;"> Android.OS;
</span><span style="color: #0000ff;">using</span><span style="color: #000000;"> Com.Baidu.Mapapi.Map;
</span><span style="color: #0000ff;">using</span><span style="color: #000000;"> Com.Baidu.Mapapi.Model;
</span><span style="color: #0000ff;">using</span><span style="color: #000000;"> Android.Graphics;
</span><span style="color: #0000ff;">using</span><span style="color: #000000;"> Android.Util;
</span><span style="color: #0000ff;">using</span><span style="color: #000000;"> System.Collections.Generic;
</span><span style="color: #0000ff;">using</span><span style="color: #000000;"> javax.Microedition.Khronos.Opengles;
</span><span style="color: #0000ff;">using</span><span style="color: #000000;"> Java.Nio;
</span><span style="color: #0000ff;">using</span><span style="color: #000000;"> Android.Opengl;

</span><span style="color: #0000ff;">namespace</span><span style="color: #000000;"> BdMapV371Demos.SrcSdkDemos
{
    </span><span style="color: #808080;">///</span> <span style="color: #808080;"><summary></summary></span>
    <span style="color: #808080;">///</span><span style="color: #008000;"> 此demo用来展示如何在地图绘制的每帧中再额外绘制一些用户自己的内容
    </span><span style="color: #808080;">///</span> <span style="color: #808080;"></span>
    [Activity(Label = <span style="color: #800000;">"</span><span style="color: #800000;">@string/demo_name_opengl</span><span style="color: #800000;">"</span><span style="color: #000000;">)]
    </span><span style="color: #0000ff;">public</span> <span style="color: #0000ff;">class</span><span style="color: #000000;"> Demo24OpenGL : Activity, BaiduMap.IOnMapDrawFrameCallback
    {
        </span><span style="color: #008000;">//</span><span style="color: #008000;"> 地图相关</span>
        <span style="color: #0000ff;">PRivate</span><span style="color: #000000;"> TextureMapView mMapView;
        </span><span style="color: #0000ff;">private</span><span style="color: #000000;"> BaiduMap mBaiduMap;
        </span><span style="color: #0000ff;">private</span><span style="color: #000000;"> Bitmap bitmap;
        </span><span style="color: #0000ff;">private</span> LatLng latlng1 = <span style="color: #0000ff;">new</span> LatLng(<span style="color: #800080;">39.97923</span>, <span style="color: #800080;">116.357428</span><span style="color: #000000;">);
        </span><span style="color: #0000ff;">private</span> LatLng latlng2 = <span style="color: #0000ff;">new</span> LatLng(<span style="color: #800080;">39.94923</span>, <span style="color: #800080;">116.397428</span><span style="color: #000000;">);
        </span><span style="color: #0000ff;">private</span> LatLng latlng3 = <span style="color: #0000ff;">new</span> LatLng(<span style="color: #800080;">39.96923</span>, <span style="color: #800080;">116.437428</span><span style="color: #000000;">);
        </span><span style="color: #0000ff;">private</span> IList<latlng><span style="color: #000000;"> latLngPolygon;
        </span><span style="color: #0000ff;">private</span> <span style="color: #0000ff;">float</span><span style="color: #000000;">[] vertexs;
        </span><span style="color: #0000ff;">private</span><span style="color: #000000;"> FloatBuffer vertexBuffer;
        </span><span style="color: #0000ff;">private</span> <span style="color: #0000ff;">int</span> textureId = -<span style="color: #800080;">1</span><span style="color: #000000;">;
        </span><span style="color: #0000ff;">private</span> <span style="color: #0000ff;">readonly</span> <span style="color: #0000ff;">string</span> LTAG = <span style="color: #800000;">"</span><span style="color: #800000;">Demo24OpenGL</span><span style="color: #800000;">"</span><span style="color: #000000;">;

        </span><span style="color: #0000ff;">protected</span> <span style="color: #0000ff;">override</span> <span style="color: #0000ff;">void</span><span style="color: #000000;"> OnCreate(Bundle savedInstanceState)
        {
            </span><span style="color: #0000ff;">base</span><span style="color: #000000;">.OnCreate(savedInstanceState);
            SetContentView(Resource.Layout.demo24_opengl);
            mMapView </span>= FindViewById<texturemapview><span style="color: #000000;">(Resource.Id.bmapView);
            mBaiduMap </span>=<span style="color: #000000;"> mMapView.Map;
            latLngPolygon </span>= <span style="color: #0000ff;">new</span> List<latlng><span style="color: #000000;">()
            {
                latlng1,latlng2,latlng3
            };
            mBaiduMap.SetOnMapDrawFrameCallback(</span><span style="color: #0000ff;">this</span><span style="color: #000000;">);
            bitmap </span>=<span style="color: #000000;"> BitmapFactory.DecodeResource(Resources,
                Resource.Drawable.ground_overlay);
        }

        </span><span style="color: #0000ff;">protected</span> <span style="color: #0000ff;">override</span> <span style="color: #0000ff;">void</span><span style="color: #000000;"> OnPause()
        {
            mMapView.OnPause();
            </span><span style="color: #0000ff;">base</span><span style="color: #000000;">.OnPause();
        }
        </span><span style="color: #0000ff;">protected</span> <span style="color: #0000ff;">override</span> <span style="color: #0000ff;">void</span><span style="color: #000000;"> OnResume()
        {
            mMapView.OnResume();
            textureId </span>= -<span style="color: #800080;">1</span><span style="color: #000000;">;
            </span><span style="color: #0000ff;">base</span><span style="color: #000000;">.OnResume();
        }

        </span><span style="color: #0000ff;">protected</span> <span style="color: #0000ff;">override</span> <span style="color: #0000ff;">void</span><span style="color: #000000;"> OnDestroy()
        {
            mMapView.OnDestroy();
            </span><span style="color: #0000ff;">base</span><span style="color: #000000;">.OnDestroy();
        }

        </span><span style="color: #0000ff;">public</span> <span style="color: #0000ff;">void</span><span style="color: #000000;"> OnMapDrawFrame(IGL10 gl, MapStatus drawingMapStatus)
        {
            </span><span style="color: #0000ff;">if</span> (mBaiduMap.Projection != <span style="color: #0000ff;">null</span><span style="color: #000000;">)
            {
                calPolylinePoint(drawingMapStatus);
                drawPolyline(gl, Color.Argb(</span><span style="color: #800080;">255</span>, <span style="color: #800080;">255</span>, <span style="color: #800080;">0</span>, <span style="color: #800080;">0</span>), vertexBuffer, <span style="color: #800080;">10</span>, <span style="color: #800080;">3</span><span style="color: #000000;">,
                        drawingMapStatus);
                drawTexture(gl, bitmap, drawingMapStatus);
            }
        }
        </span><span style="color: #0000ff;">public</span> <span style="color: #0000ff;">void</span><span style="color: #000000;"> calPolylinePoint(MapStatus mspStatus)
        {
            PointF[] polyPoints </span>= <span style="color: #0000ff;">new</span><span style="color: #000000;"> PointF[latLngPolygon.Count];
            vertexs </span>= <span style="color: #0000ff;">new</span> <span style="color: #0000ff;">float</span>[<span style="color: #800080;">3</span> *<span style="color: #000000;"> latLngPolygon.Count];
            </span><span style="color: #0000ff;">int</span> i = <span style="color: #800080;">0</span><span style="color: #000000;">;
            </span><span style="color: #0000ff;">foreach</span> (LatLng xy <span style="color: #0000ff;">in</span><span style="color: #000000;"> latLngPolygon)
            {
                polyPoints[i] </span>=<span style="color: #000000;"> mBaiduMap.Projection.ToOpenGLLocation(xy, mspStatus);
                vertexs[i </span>* <span style="color: #800080;">3</span>] =<span style="color: #000000;"> polyPoints[i].X;
                vertexs[i </span>* <span style="color: #800080;">3</span> + <span style="color: #800080;">1</span>] =<span style="color: #000000;"> polyPoints[i].Y;
                vertexs[i </span>* <span style="color: #800080;">3</span> + <span style="color: #800080;">2</span>] = <span style="color: #800080;">0.0f</span><span style="color: #000000;">;
                i</span>++<span style="color: #000000;">;
            }
            </span><span style="color: #0000ff;">for</span> (<span style="color: #0000ff;">int</span> j = <span style="color: #800080;">0</span>; j )
            {
                Log.Debug(LTAG, <span style="color: #800000;">"</span><span style="color: #800000;">vertexs[</span><span style="color: #800000;">"</span> + j + <span style="color: #800000;">"</span><span style="color: #800000;">]: </span><span style="color: #800000;">"</span> +<span style="color: #000000;"> vertexs[j]);
            }
            vertexBuffer </span>=<span style="color: #000000;"> makeFloatBuffer(vertexs);
        }

        </span><span style="color: #0000ff;">private</span> FloatBuffer makeFloatBuffer(<span style="color: #0000ff;">float</span><span style="color: #000000;">[] fs)
        {
            ByteBuffer bb </span>= ByteBuffer.AllocateDirect(fs.Length * <span style="color: #800080;">4</span><span style="color: #000000;">);
            bb.Order(ByteOrder.NativeOrder());
            FloatBuffer fb </span>=<span style="color: #000000;"> bb.AsFloatBuffer();
            fb.Put(fs);
            fb.Position(</span><span style="color: #800080;">0</span><span style="color: #000000;">);
            </span><span style="color: #0000ff;">return</span><span style="color: #000000;"> fb;
        }

        </span><span style="color: #0000ff;">private</span> <span style="color: #0000ff;">void</span> drawPolyline(IGL10 gl, <span style="color: #0000ff;">int</span><span style="color: #000000;"> color, FloatBuffer lineVertexBuffer,
                </span><span style="color: #0000ff;">float</span> lineWidth, <span style="color: #0000ff;">int</span><span style="color: #000000;"> pointSize, MapStatus drawingMapStatus)
        {

            gl.GlEnable(GL10.GlBlend);
            gl.GlEnableClientState(GL10.GlVertexArray);

            gl.GlBlendFunc(GL10.GlSrcAlpha, GL10.GlOneMinusSrcAlpha);

            </span><span style="color: #0000ff;">float</span> colorA = Color.GetAlphaComponent(color) /<span style="color: #000000;"> 255f;
            </span><span style="color: #0000ff;">float</span> colorR = Color.GetRedComponent(color) /<span style="color: #000000;"> 255f;
            </span><span style="color: #0000ff;">float</span> colorG = Color.GetGreenComponent(color) /<span style="color: #000000;"> 255f;
            </span><span style="color: #0000ff;">float</span> colorB = Color.GetBlueComponent(color) /<span style="color: #000000;"> 255f;

            gl.GlVertexPointer(</span><span style="color: #800080;">3</span>, GL10.GlFloat, <span style="color: #800080;">0</span><span style="color: #000000;">, lineVertexBuffer);
            gl.GlColor4f(colorR, colorG, colorB, colorA);
            gl.GlLineWidth(lineWidth);
            gl.GlDrawArrays(GL10.GlLineStrip, </span><span style="color: #800080;">0</span><span style="color: #000000;">, pointSize);

            gl.GlDisable(GL10.GlBlend);
            gl.GlDisableClientState(GL10.GlVertexArray);
        }

        </span><span style="color: #808080;">///</span> <span style="color: #808080;"><summary></summary></span>
        <span style="color: #808080;">///</span><span style="color: #008000;"> 使用opengl坐标绘制
        </span><span style="color: #808080;">///</span> <span style="color: #808080;"></span>
        <span style="color: #808080;">///</span> <span style="color: #808080;"><param name="gl"></span>
        <span style="color: #808080;">///</span> <span style="color: #808080;"><param name="bitmap"></span>
        <span style="color: #808080;">///</span> <span style="color: #808080;"><param name="drawingMapStatus"></span>
        <span style="color: #0000ff;">public</span> <span style="color: #0000ff;">void</span><span style="color: #000000;"> drawTexture(IGL10 gl, Bitmap bitmap, MapStatus drawingMapStatus)
        {
            PointF p1 </span>=<span style="color: #000000;"> mBaiduMap.Projection.ToOpenGLLocation(latlng2,
                    drawingMapStatus);
            PointF p2 </span>=<span style="color: #000000;"> mBaiduMap.Projection.ToOpenGLLocation(latlng3,
                    drawingMapStatus);
            ByteBuffer byteBuffer </span>= ByteBuffer.AllocateDirect(<span style="color: #800080;">4</span> * <span style="color: #800080;">3</span> * <span style="color: #800080;">4</span><span style="color: #000000;">);
            byteBuffer.Order(ByteOrder.NativeOrder());
            FloatBuffer vertices </span>=<span style="color: #000000;"> byteBuffer.AsFloatBuffer();
            vertices.Put(</span><span style="color: #0000ff;">new</span> <span style="color: #0000ff;">float</span>[] { p1.X, p1.Y, <span style="color: #800080;">0.0f</span>, p2.X, p1.Y, <span style="color: #800080;">0.0f</span><span style="color: #000000;">, p1.X,
                p2.Y, </span><span style="color: #800080;">0.0f</span>, p2.X, p2.Y, <span style="color: #800080;">0.0f</span><span style="color: #000000;"> });

            ByteBuffer indicesBuffer </span>= ByteBuffer.AllocateDirect(<span style="color: #800080;">6</span> * <span style="color: #800080;">2</span><span style="color: #000000;">);
            indicesBuffer.Order(ByteOrder.NativeOrder());
            ShortBuffer indices </span>=<span style="color: #000000;"> indicesBuffer.AsShortBuffer();
            indices.Put(</span><span style="color: #0000ff;">new</span> <span style="color: #0000ff;">short</span>[] { <span style="color: #800080;">0</span>, <span style="color: #800080;">1</span>, <span style="color: #800080;">2</span>, <span style="color: #800080;">1</span>, <span style="color: #800080;">2</span>, <span style="color: #800080;">3</span><span style="color: #000000;"> });

            ByteBuffer textureBuffer </span>= ByteBuffer.AllocateDirect(<span style="color: #800080;">4</span> * <span style="color: #800080;">2</span> * <span style="color: #800080;">4</span><span style="color: #000000;">);
            textureBuffer.Order(ByteOrder.NativeOrder());
            FloatBuffer texture </span>=<span style="color: #000000;"> textureBuffer.AsFloatBuffer();
            texture.Put(</span><span style="color: #0000ff;">new</span> <span style="color: #0000ff;">float</span>[] { <span style="color: #800080;">0</span><span style="color: #000000;">, 1f, 1f, 1f, 0f, 0f, 1f, 0f });

            indices.Position(</span><span style="color: #800080;">0</span><span style="color: #000000;">);
            vertices.Position(</span><span style="color: #800080;">0</span><span style="color: #000000;">);
            texture.Position(</span><span style="color: #800080;">0</span><span style="color: #000000;">);

            </span><span style="color: #008000;">//</span><span style="color: #008000;"> 生成纹理</span>
            <span style="color: #0000ff;">if</span> (textureId == -<span style="color: #800080;">1</span><span style="color: #000000;">)
            {
                </span><span style="color: #0000ff;">int</span>[] textureIds = <span style="color: #0000ff;">new</span> <span style="color: #0000ff;">int</span>[<span style="color: #800080;">1</span><span style="color: #000000;">];
                gl.GlGenTextures(</span><span style="color: #800080;">1</span>, textureIds, <span style="color: #800080;">0</span><span style="color: #000000;">);
                textureId </span>= textureIds[<span style="color: #800080;">0</span><span style="color: #000000;">];
                Log.Debug(LTAG, </span><span style="color: #800000;">"</span><span style="color: #800000;">textureId: </span><span style="color: #800000;">"</span> +<span style="color: #000000;"> textureId);
                gl.GlBindTexture(GL10.GlTexture2d, textureId);
                GLUtils.TexImage2D(GL10.GlTexture2d, </span><span style="color: #800080;">0</span>, bitmap, <span style="color: #800080;">0</span><span style="color: #000000;">);
                gl.GlTexParameterf(GL10.GlTexture2d, GL10.GlTextureMinFilter, GL10.GlNearest);
                gl.GlTexParameterf(GL10.GlTexture2d, GL10.GlTextureMagFilter, GL10.GlNearest);
                gl.GlBindTexture(GL10.GlTexture2d, </span><span style="color: #800080;">0</span><span style="color: #000000;">);
            }

            gl.GlEnable(GL10.GlTexture2d);
            gl.GlEnableClientState(GL10.GlVertexArray);
            gl.GlEnableClientState(GL10.GlTextureCoordArray);
            gl.GlEnable(GL10.GlBlend);
            gl.GlBlendFunc(GL10.GlSrcAlpha, GL10.GlOneMinusSrcAlpha);
            gl.GlColor4f(</span><span style="color: #800080;">1.0f</span>, <span style="color: #800080;">1.0f</span>, <span style="color: #800080;">1.0f</span>, <span style="color: #800080;">1.0f</span><span style="color: #000000;">);

            </span><span style="color: #008000;">//</span><span style="color: #008000;"> 绑定纹理ID</span>
<span style="color: #000000;">            gl.GlBindTexture(GL10.GlTexture2d, textureId);
            gl.GlVertexPointer(</span><span style="color: #800080;">3</span>, GL10.GlFloat, <span style="color: #800080;">0</span><span style="color: #000000;">, vertices);
            gl.GlTexCoordPointer(</span><span style="color: #800080;">2</span>, GL10.GlFloat, <span style="color: #800080;">0</span><span style="color: #000000;">, texture);
            gl.GlDrawElements(GL10.GlTriangleStrip, </span><span style="color: #800080;">6</span><span style="color: #000000;">, GL10.GlUnsignedShort, indices);
            gl.GlDisable(GL10.GlTexture2d);
            gl.GlDisableClientState(GL10.GlVertexArray);
            gl.GlDisableClientState(GL10.GlTextureCoordArray);
            gl.GlDisable(GL10.GlBlend);
        }
    }
}</span></latlng></texturemapview></latlng>

3. Modify the MainActivity.cs file

In the demos field definition of the MainActivity.cs file, remove the comment below [Example 24].

Run and observe the effect.