Swift - 如何在OpenGL ES中绘制线条？

Question

I'm trying to draw a black single line on GLKitView , using Swift , but it does not work. I can clear screen and I can fill it with any color, but I can't draw anything on it. And I know, this question was asked lots of times, but I could not found any answer on Swift. More over, there is no any info about using OpenGL ES with Swift, so I came here.

Here is my code:

import GLKit

class MyGLKit: GLKView {
    override func drawRect(rect: CGRect) {
        glClearColor(0.8, 0.8, 0.8, 1.0)
        glClear(GLbitfield(GL_COLOR_BUFFER_BIT))

        glColor4f(0, 0, 0, 1)

        var line: [GLfloat] = [-1, 0, 1, 0]
        var len = line.count * sizeof(GLfloat)

        // Create an handle for a buffer object array
        var bufferObjectNameArray: GLuint = 0

        // Have OpenGL generate a buffer name and store it in the buffer object array
        glGenBuffers(1, &bufferObjectNameArray);

        // Bind the buffer object array to the GL_ARRAY_BUFFER target buffer
        glBindBuffer(GLbitfield(GL_ARRAY_BUFFER), bufferObjectNameArray);

        // Send the line data over to the target buffer in GPU RAM
        glBufferData(
        GLbitfield(GL_ARRAY_BUFFER),    // the target buffer
        len,                            // the number of bytes to put into the buffer
        line,                           // a pointer to the data being copied
        GLbitfield(GL_STATIC_DRAW));    // the usage pattern of the data

        glVertexPointer(2, GLbitfield(GL_FLOAT), 0, line);
        var programHandle: GLuint = glCreateProgram()
        glLinkProgram(programHandle)

        glDrawArrays(GLbitfield(GL_LINES), 0, 2);
    }
}

I'm not sure what this code doing, cause OpenGL ES seems insanely, after usual OpenGL. I mean, you need to write a lot of code just to draw a single line. Why does it work that way?

Answer 1

I have not used Swift, but based on code in OpenGL EXC_BAD_ACCESS when calling glDrawElements in Swift but not in Objective-C , your glVertexPointer() call should look like this:

let bufferOffset: CConstVoidPointer = COpaquePointer(UnsafePointer<Int>(0))
glVertexPointer(2, GLbitfield(GL_FLOAT), 0, bufferOffset);

It also looks like you're not really building a shader program:

var programHandle: GLuint = glCreateProgram()
glLinkProgram(programHandle)

There's a bunch of things that need to go between here if you're using plain OpenGL. You need to create shader objects, give them code written in GLSL, make calls to compile the shaders, etc. I believe GLKit has functionality to use pre-baked shaders.

As for why OpenGL is so "insane", that's beyond the scope of this site. And very subjective. IMHO, the main point to keep in mind is that OpenGL is not designed to be a convenient API for programmers. It is designed to provide a relatively thin generic abstraction for accessing graphics hardware. And the tendency for comparable APIs is actually to make the abstraction layer even thinner to reduce overhead (see eg DirectX 12).

There's nothing stopping anybody from implementing more convenient higher level APIs on top of OpenGL. These interfaces exist, and people use them.

Answer 2

Looks like you need to add GLKBaseEffect

Anyway here is my working solution: To test, create a MyGLKit.swift file

import Foundation
import GLKit
import OpenGLES

struct OpenGLColor {
    var r: GLubyte = 0
    var g: GLubyte = 0
    var b: GLubyte = 0
    var a: GLubyte = 0
}

class MyGLKit: GLKView {

    var lineData: [GLfloat] = []
    var colorData: [GLubyte] = []
    var linesCount:Int = 0

    func setup(){
        self.context = EAGLContext(api: .openGLES2)!
        EAGLContext.setCurrent(self.context)

        //effect
        let effect: GLKBaseEffect = GLKBaseEffect()
        let projectionMatrix: GLKMatrix4 = GLKMatrix4MakeOrtho(-1.0, 1.0, -1.0, 1.0, 1.0, -1.0)
        effect.transform.projectionMatrix = projectionMatrix
        effect.prepareToDraw()


        //OPTIONAL > disable slow GL extensions
        glDisable(GLenum(GL_DEPTH_TEST))
        glDisable(GLenum(GL_BLEND))
        glDisable(GLenum(GL_DITHER))
        glDisable(GLenum(GL_STENCIL_TEST))
        glDisable(GLenum(GL_TEXTURE_2D))
        //

        glTexParameteri(GLenum(GL_TEXTURE_2D), GLenum(GL_TEXTURE_MAG_FILTER), GL_NEAREST)
        glTexParameteri(GLenum(GL_TEXTURE_2D), GLenum(GL_TEXTURE_MIN_FILTER), GL_NEAREST)
        glEnableVertexAttribArray(GLuint(GLKVertexAttrib.position.rawValue))
        glEnableVertexAttribArray(GLuint(GLKVertexAttrib.color.rawValue))

    }

    func drawLine(x:GLfloat, y:GLfloat, x2:GLfloat, y2:GLfloat, color: OpenGLColor){

        //suppport for retina
        var x = x
        var y = y
        var x2 = x2
        var y2 = y2
        x *= 2
        x2 *= 2
        y *= 2
        y2 *= 2

        //calculate position for opengl
        let w: GLfloat = GLfloat(self.bounds.size.width)
        let h: GLfloat = GLfloat(self.bounds.size.height)

        //coordinates x/y
        lineData.append(((1.0/w)*x)-1)
        lineData.append(1-((1.0/h)*y))
        lineData.append(0)
        lineData.append(((1.0/w)*x2)-1)
        lineData.append(1-((1.0/h)*y2))
        lineData.append(0)

        //color
        colorData.append(color.r)
        colorData.append(color.g)
        colorData.append(color.b)
        colorData.append(color.a)
        colorData.append(color.r)
        colorData.append(color.g)
        colorData.append(color.b)
        colorData.append(color.a)

        linesCount += 1

    }

    override func draw(_ rect: CGRect) {

        glLineWidth(1.0)
        glClearColor(0.8, 0.8, 0.8, 1.0)
        glClear(GLbitfield(GL_COLOR_BUFFER_BIT))

        //draw layer
        if (lineData.count > 0){
            glVertexAttribPointer(GLuint(GLKVertexAttrib.position.rawValue), 3, GLenum(GL_FLOAT), GLboolean(GL_FALSE), 0, lineData)
            glVertexAttribPointer(GLuint(GLKVertexAttrib.color.rawValue), 4, GLenum(GL_UNSIGNED_BYTE), GLboolean(GL_TRUE), 0, colorData)
            glDrawArrays(GLenum(GL_LINES), 0, GLsizei(linesCount*2))
        }
    }

}

Then use it for example in your UIViewController:

let g = MyGLKit()
        g.setup()
        g.frame = self.view.bounds
        self.view.addSubview(g)
        var color = OpenGLColor()
        color.r = 20
        color.b = 30
        color.g = 40
        color.a = 255
        g.drawLine(x: 10, y: 10, x2: GLfloat(g.frame.size.width), y2: 10, color: color)
        g.drawLine(x: 10, y: 50, x2: GLfloat(g.frame.size.width), y2: 50, color: color)
        g.setNeedsDisplay()