Campo de texto redondeado AS3
-
11-07-2019 - |
Pregunta
¿Alguien sabe cómo crear un campo de texto dinámico con un borde visible y esquinas redondeadas en AS3?
Creo que podría tener que crear un clip de película redondeado, cambiar el tamaño y colocarlo detrás del texto.
Intenté esto, pero no veo ningún cambio.
var styleRound:StyleSheet = new StyleSheet();
styleRound.parseCSS("h4{cornerRadius:10;borderStyle: solid; borderThickness: 1;}");
tf.htmlText = "<h4>" + hotspotData.caption + "</h4>";
tf.styleSheet = styleRound;
Solución
Aquí hay una lista de los estilos CSS disponibles para TextFields en ActionScript 3 . Lo sentimos, no hay radio de esquina.
Puede activar un borde para un campo de texto en los objetos TextField propiedad de borde . Pero no hay una propiedad disponible para doblar la esquina.
Le sugiero que cree un nuevo componente y agregue el borde usted mismo como Sprite debajo de TextField. Algo así como:
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);
}
}
}
Otros consejos
Terminé creando un rectángulo redondeado en flash y exportándolo como su propia clase: hotspotBG.
var hotspotBackground:hotspotBG = new hotspotBG();
hotspotBackground.width = textField.width + 10;
caption.addChild(hotspotBackground);
No puede cambiar el campo de texto por sí mismo, a partir de 2014 flash no lo permite.
Lo que puede hacer es eliminar el fondo y los bordes, que dejará el campo de texto completamente transparente, luego agregue una imagen (la herramienta de rectángulo es la forma más fácil de hacer esto) en la parte posterior del campo de texto, para que el campo de texto se encuentre encima de la imagen (eje z)
Puede que no sea la forma en que pensabas, ¡pero demonios funciona!
// estás borrando el fondo y los bordes
// y reemplazarlos con una imagen
textbox.background = false;
textbox.border = false;
¿Puedes usar los estilos CSS? Algo así como:
TextInput {
borderStyle: solid;
borderThickness: 1;
cornerRadius: 2;
}
No he probado esto, pero eso debería darte una esquina redondeada.