Problem: Draw with metal-cpp – Uncover

Steel is the inspiration for accelerated graphics and compute energy on Apple platforms — and for those who’re aware of C++, now’s the proper time to discover its unimaginable energy. For this problem, we’re inviting you to check out metal-cpp and render your personal triangle, sphere, or perhaps a mesh in Xcode.

We additionally welcome you to go to the Graphics & Video games Research Corridor through the day to collaborate on this problem! Ask questions, join with different builders, and share your creations.

Start the problem

Earlier than you start, you’ll wish to watch “Program Steel in C++ with metal-cpp” and obtain the LearnMetalCPP challenge, which comprises a collection of C++ samples.

Program Steel in C++ with metal-cpp

Your C++ video games and apps can now faucet into the facility of Steel. We’ll present you ways metal-cpp helps you bridge your C++ code to Steel, discover how every manages object lifecycles, and show utilities that may assist these language cooperate in your app. We’ll additionally share finest practices for designing…

Obtain the LearnMetalCPP challenge

Open the challenge in Xcode, and select 00-window.cpp as your base code. To render your picture, you’ll have to arrange a number of issues inside your challenge.

First, create a MTL::RenderPipelineState object with a MTL::RenderPipelineDescriptor. To do that, you’ll have to create a perform, like buildShaders(). Within the code snippet beneath, we’ve offered the shader code wanted to render a single triangle.

void Renderer::buildShaders()
{
    utilizing NS::StringEncoding::UTF8StringEncoding;

    const char* shaderSrc = R"(
        #embody <metal_stdlib>
        utilizing namespace metallic;
        struct AAPLVertex
        {
            float3 place;
            half3  colour;
        };
    
        // Welcome to switch the mesh as you need
        fixed AAPLVertex triangles[] = {
            { float3{ -0.8f,  0.8f, 0.0f }, half3{  1.0, 0.3f, 0.2f } },
            { float3{  0.0f, -0.8f, 0.0f }, half3{  0.8f, 1.0, 0.0f } },
            { float3{ +0.8f,  0.8f, 0.0f }, half3{  0.8f, 0.0f, 1.0 } }
        };
    
        struct v2f
        {
            float4 place [[position]];
            half3 colour;
        };

        v2f vertex vertexMain( uint vertexId [[vertex_id]])
        {
            v2f o;
            o.place = float4( triangles[ vertexId ].place, 1.0 );
            o.colour = half3 ( triangles[ vertexId ].colour );
            return o;
        }

        half4 fragment fragmentMain( v2f in [[stage_in]] )
        {
            return half4( in.colour, 1.0 );
        }
    )";
    
    
}

Then, lengthen the Renderer::draw( MTK::View* pView) perform by setting a MTL::RenderPipelineState and inserting draw calls.

void Renderer::draw(  MTK::View* pView  )
{
...
    
    
...
}

After that:

• Create the MTL::RenderPipelineDescriptor object and arrange some properties.
• Create the MTL::RenderPipelineState object.
• Tip: Watch out with object lifecycles.

Able to share your metal-cpp artwork with the group? Present us what you’ve made on Twitter with the hashtag #WWDC22Challenges, or share your work within the Graphics & Video games Research Corridor. And if you would like to debate metal-cpp and different Graphics & Video games subjects, be part of the workforce at occasions all all through the week at WWDC22.

Discover #WWDC22Challenges on social media

Learn the WWDC22 Challenges Phrases and Circumstances