6

SKLabelNode をスタイルする方法は本当にありませんか? フォントや色を変更するだけではありません。最初の SKLabelNode の後ろに 2 番目の SKLabelNode を作成することで、ドロップ シャドウを追加するようなことができることはわかっています (すでにハッキングされています)。退屈な単調なテキストから抜け出すためにできることが何もないのは奇妙に思えます。

つまり..スプライトキットのノード数でさえクールなグラデーションスタイルを持っています.それはどのように行われますか?!

ここに画像の説明を入力

わかりましたので、ここでグラデーション効果を再現しようとしています。ブレンド モードのすべての組み合わせと、色と colorBlendFactor の複数の組み合わせを試しました。

アルファ

アルファ

かける

ここに画像の説明を入力

追加

ここに画像の説明を入力

ここにコードがあります

let testNode = SKLabelNode(text: "hey there")
testNode.fontSize = 30
testNode.color = SKColor.blueColor()
testNode.colorBlendFactor = 1
testNode.fontName = "Helvetica-Bold"
testNode.blendMode = SKBlendMode.Multiply
testNode.colorBlendFactor = 0.6
testNode.position = CGPoint(x: self.size.width/2, y: self.size.height/2)

self.addChild(testNode)
4

3 に答える 3

4

シェーダーを使えば簡単です。「TheShader.fsh」という名前のテキスト ファイルをプロジェクトに追加します。

void main()
{
    float yPos = gl_FragCoord.y - labelBase;
    float gradient = yPos / u_sprite_size.y; // ranges from 0 at base to 1 at top

    vec4 color = SKDefaultShading(); // the current label color
    color = vec4(gradient + color.r, gradient + color.g, gradient + color.b, color.a);
    color.rgb *= color.a; // set background to alpha 0

    gl_FragColor = color;
}

次に、SKScene で SKEffectNode を作成し、そのシェーダーを "TheShader" に設定し、効果ノードの子としてラベルを追加します。ラベルは、下部のラベルの fontColor から上部の白までの範囲の垂直グラデーションを使用して描画されます。

override func didMoveToView(view: SKView)
{
    makeGradientLabel("318 nodes 60.0 fps", labelPosition: CGPoint(x: CGRectGetMidX(frame), y: CGRectGetMidY(frame)))
}

func makeGradientLabel(labelText: String, labelPosition: CGPoint)
{
    let myShader = SKShader(fileNamed: "TheShader")
    let labelBase = SKUniform(name: "labelBase", float: Float(labelPosition.y))
    myShader.addUniform(labelBase)

    let effectNode = SKEffectNode()
    effectNode.shader = myShader
    effectNode.shouldEnableEffects = true
    addChild(effectNode)

    let theLabel = SKLabelNode(fontNamed: "Courier")
    theLabel.fontSize = 36
    theLabel.fontColor = SKColor.blueColor()
    theLabel.text = labelText
    theLabel.position = labelPosition

    effectNode.addChild(theLabel)
}

ラベルを移動する場合は、labelBase ユニフォームを更新して、シェーダーがラベルの場所を認識できるようにする必要があります。

labelBase.floatValue = Float(theLabel.position.y)
于 2015-02-04T12:52:00.280 に答える
2

グラデーション スタイルを実現できる SKLabelNode のメソッドまたはプロパティはありません。コメントのリンクに記載されているように、SpriteKit には SKBitmapFont プライベート クラスがありますが、それは役に立ちません。

独自のソリューションを展開するか、グリフ デザイナーを試すことができます: https://71squared.com/glyphdesigner

于 2015-01-13T19:34:21.337 に答える