2015-01-09 4 views
5

Gibt es wirklich keine Möglichkeit, SKLabelNode zu stylen? Ich meine, über die Änderung der Schriftart und der Farbe hinaus. Ich weiß, dass ich etwas wie das Hinzufügen eines Schlagschattens tun kann, indem ich einen zweiten SKLabelNode hinter dem ersten (schon sortierten Hacky) erzeuge. Das Erstellen von Bildern für meine Schriftart wäre aus offensichtlichen Gründen auch schrecklich. Es scheint merkwürdig, dass Sie nichts tun können, um aus langweiligem, flachem Text auszubrechen.Gibt es wirklich keine Möglichkeit, SKLabelNode zu stylen?

Ich meine .. sogar die Spritekit Node Count hat einen coolen Gradienten-Stil ... wie ist das fertig ?!

enter image description here

okay, so bin ich hier versuche, einen Farbverlauf zu erstellen. Ich habe jede Kombination aus Mischmodus und mehreren Kombinationen aus Farbe und colorBlendFactor ausprobiert.

alpha

alpha

multiply

enter image description here

hinzufügen

enter image description here

hier ist der Code

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) 
+0

Was ist mit den richtigen Werten für 'fontColor',' color' und 'colorBlendFactor'? 'blendMode' könnte auch helfen. – rmaddy

+0

Ich denke, meine Frage ist, könnten Sie etwas wie die Nodecount Schriftart ich oben abgebildet mit Spritekit – hamobi

+0

Versuchen Sie, was ich gerade vorgeschlagen habe. Sieh, was du bekommst. – rmaddy

Antwort

2

Es gibt keine Methode oder Eigenschaft von SKLabelNode, die Ihnen ermöglichen, den Gradienten Stil zu erreichen. Wie in dem Link in den Kommentaren erwähnt, hat SpriteKit eine SKBitmapFont private Klasse, aber das wird dir nicht helfen.

können Sie entweder Ihre eigene Lösung rollen oder Glyphe Designer versuchen: https://71squared.com/glyphdesigner

3

Es ist ziemlich einfach, mit einem Shader. Fügen Sie eine Textdatei zu einem Projekt namens „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; 
} 

Jetzt eine SKEffectNode in SKScene erstellen, setzen Sie den Shader „TheShader“, und fügen Sie Ihre Bezeichnung als Kind des Effekts Knoten. Die Beschriftung wird mit einem vertikalen Farbverlauf gezeichnet, der von der Beschriftung fontColor unten bis oben weiß reicht.

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) 
} 

Wenn Sie das Etikett bewegen Sie die labelBase Uniform aktualisieren müssen, so dass die Shader wissen, wo es ist:

labelBase.floatValue = Float(theLabel.position.y) 
+0

Ich habe es versucht, aber das Etikett ist nur blau für mich. Ich habe es für ObjC umgeschrieben, aber habe hoffentlich keine Fehler gemacht. – Jonny

+0

Ich bekomme eine Fehlermeldung in der Konsole: ** Fehler: Verwendung der nicht deklarierten Bezeichner 'SKDefaultShading' ** – Jonny

+0

Oups gibt es ein verwandtes Thema zu diesem Thema: http://stackoverflow.com/questions/31492404/spritekit-shader- crash-ios-9-skdedefaultshading-gl-fragcoord – Jonny

1

Nach viel Versuch und Irrtum, bekam ich diese Arbeit:

{ 
     const CGFloat LABELFONTSIZE = 100; 
     SKColor* fontcolor = [SKColor redColor]; 

     UIFont* font = [AppDelegate fontOfType:Fonttype_main size:LABELFONTSIZE]; // LABELFONTSIZE not used here but whatever. 
     SKLabelNode* label = [SKLabelNode labelNodeWithFontNamed:font.fontName]; 
     label.fontColor = fontcolor; 
     label.verticalAlignmentMode = SKLabelVerticalAlignmentModeTop; 
     self.labelScore = label; 
     //label.zPosition = Z_HUD; 
     label.fontSize = LABELFONTSIZE; 

     self.score = 0; 

     const CGPoint LABELPOSITION = CGPointMake(self.size.width * 0.5, self.size.height); 
     label.position = LABELPOSITION; 

#define USESHADER 
#ifdef USESHADER 
     SKShader* myShader = [SKShader shaderWithFileNamed:@"TheShader"]; 
     NSAssert(myShader, @"myShader was nil!"); 

     SKEffectNode* effectNode = [SKEffectNode node]; 
     effectNode.zPosition = Z_HUD; 
     effectNode.shader = myShader; 
     effectNode.shouldEnableEffects = YES; 
     [self addChild:effectNode]; 

     [effectNode addChild:label]; 
#else 
     label.zPosition = Z_HUD; 
     [self addChild:label]; 
#endif 

     [label runAction:[SKAction repeatActionForever:[SKAction sequence:@[ 
                      [SKAction moveByX:0 y:-300 duration:3.0], 
                      [SKAction moveByX:0 y:300 duration:3.0], 
                      ]]]]; 
    } 

TheShader.fsh:

void main() 
{ 
    float gradient = v_tex_coord.y; 
    //vec4 color = SKDefaultShading(); // the current label color THIS DOES NOT WORK ON IOS 9.2 AND EARLIERISH (MAYBE IT DOES ON IOS 8) WORKS ONLY ON IOS 9.3 BETA AT THIS MOMENT! 
    vec4 color = texture2D(u_texture, v_tex_coord); 
    color = vec4(color.r + gradient, color.g + gradient, color.b + gradient, color.a); 
    color.rgb *= color.a; // set background to alpha 0 
    gl_FragColor = color; 
} 

Es basiert auf Löngards Antwort, verwendet aber keine Uniformen. Ein paar der Sachen im Shader funktionierten bei einigen iOS 9-Versionen, einschließlich der neuesten Version von iOS 9.3 (20160115), nicht. Dieser Code oben funktioniert gut, es interessiert nicht einmal die Position des Etiketts auf dem Bildschirm; Ich animiere das Label hoch/runter, um dies zu bestätigen.

Verwandte Themen