Champ de texte arrondi AS3

Question

Quelqu'un sait-il comment créer un champ de texte dynamique avec une bordure visible et des angles arrondis dans AS3?

Je pense que je devrai peut-être créer un MovieClip arrondi, le redimensionner et le placer derrière le texte.

J'ai essayé cela, mais je ne vois aucun changement.

var styleRound:StyleSheet = new StyleSheet();
styleRound.parseCSS("h4{cornerRadius:10;borderStyle: solid; borderThickness: 1;}");
tf.htmlText = "<h4>" + hotspotData.caption + "</h4>";
tf.styleSheet = styleRound;

Answer 1

Voici une liste des styles CSS disponibles pour TextFields dans ActionScript 3 . Désolé, il n'y a pas de rayon de coin.

Vous pouvez activer une bordure pour un champ de texte sur les objets TextField propriété de bordure . Mais il n’ya pas de propriété disponible au coin de la rue.

Je vous suggère de créer un nouveau composant et d’ajouter la bordure vous-même sous la forme d’un Sprite sous TextField. Quelque chose comme:

package
{

import flash.display.Graphics;
import flash.display.Sprite;
import flash.text.TextField;
import flash.text.TextFieldAutoSize;

public class TextBorder extends Sprite
{
    private static const CORNER_RADIUS:int = 5;
    // display objects
    private var background:Sprite;
    private var field:TextField;

    // properties
    private var _text:String;

    public function TextBorder()
    {
        background = new Sprite;
        field = new TextField;
        field.autoSize = TextFieldAutoSize.LEFT;

        addChild(background);
        addChild(field);

        // TESTING:
        text = "Hello World";
    }

    public function set text(newText:String):void
    {
        _text = newText;
        display();
    }

    public function get text():String
    {
        return _text;
    }

    private function display():void
    {
        field.text = _text;

        var g:Graphics = background.graphics;
        g.clear();
        g.lineStyle(0, 0x0);
        g.beginFill(0xFFFFFF);
        g.drawRoundRect(0, 0, field.width, field.height, CORNER_RADIUS);
    }
}

}

Answer 2

J'ai fini par créer un rectangle arrondi en flash et l'exporter sous sa propre classe - hotspotBG.

var hotspotBackground:hotspotBG = new hotspotBG();
hotspotBackground.width = textField.width + 10;
caption.addChild(hotspotBackground);

Answer 3

Vous ne pouvez pas modifier le champ de texte lui-même, à partir de 2014, le flash ne le permet pas.

Ce que vous pouvez faire est de supprimer l’arrière-plan et les bordures, qui laissera le champ de texte complètement transparent, ajoutez ensuite une image (l'outil rectangle est le moyen le plus simple de le faire) à l'arrière du champ de texte, de sorte que le champ de texte est au-dessus de l'image (axe z)

Ce n'est peut-être pas ce que vous pensiez, mais ça marche!

// vous supprimez l'arrière-plan et les bordures // et les remplacer par une image textbox.background = false; textbox.border = false;

Answer 4

Pouvez-vous simplement utiliser les styles CSS? Quelque chose comme:

TextInput { 
  borderStyle: solid; 
  borderThickness: 1; 
  cornerRadius: 2; 
}

Je n’ai pas testé cela, mais cela devrait vous donner un angle arrondi.