Skip to main content
Inspiring
June 25, 2023
Question

problema centrado de un texto sprite

  • June 25, 2023
  • 1 reply
  • 158 views

hello community. I'm trying to put a sprite object (a text with a border) centered and it's impossible. In animate debugging it goes well, but when passing the apk to the mobile it goes wrong. And it goes wrong because the scale property doesn't work well in sprites and it does in movieclips (on the stage there is a movieclip (the background) and the text and sprite frame)

scale works well in the entire application, but when scaling the sprite object (the only one in the app) it decenters me (if I remove the scaling the text comes out without scaling but centered). Any idea how to fix it?. Thanks a lot

 

//sprite text
	var container:Sprite = new Sprite();
	var cornerRadius:Number= 20; // Radio de las esquinas redondeadas
	var borderColor:uint = 0xEFB810; // Color del borde
	var textField:TextField = new TextField();
	var textFormat:TextFormat = new TextFormat();
	var borderWidth:Number = 6;
	var padding:Number = 30;

//scale
protected function stageReady(e: Event = null): void {


	initialStageWidth = 469;
	initialStageHeight = 835;
	scale = stage.stageHeight / initialStageHeight;
	scaleX = scaleY = scale;

	//align the stage to the top left corner of the window/container
	stage.align = StageAlign.TOP_LEFT;
	//don't scale the content when the window resizes
	stage.scaleMode = StageScaleMode.NO_SCALE;

	//listen for when the window is resized
	stage.addEventListener(Event.RESIZE, stageResized);
}
container.scaleX = container.scaleY = rate_end;
textField.scaleX = textField.scaleY = rate_end;
blackPage.scaleX = blackPage.scaleY = rate_end;

//sprite text (2)

var welcomeMessage:String = xml.firstChild.firstChild.firstChild.nodeValue;
textField.multiline = true;
textField.wordWrap = true;
textField.autoSize = TextFieldAutoSize.LEFT;
textField.width = 300; // Ancho máximo del texto
textField.height = 100; // Altura automática del texto
textFormat.size = 18; // Tamaño de fuente
textFormat.font = "Chakra Petch"; // Fuente del texto
textFormat.color = 0xFFFFFF; // Color de fuente blanco
textFormat.align = TextFormatAlign.CENTER;
textField.text = welcomeMessage;
textField.setTextFormat(textFormat);
container.graphics.lineStyle(borderWidth, borderColor,100); // Grosor y color del borde
container.graphics.drawRoundRect(0, 0, textField.width + padding*2, textField.height + padding*2, cornerRadius, cornerRadius);
container.x = stage.stageWidth/2 - container.width/2;
container.y = stage.stageHeight/2 - container.height/2
textField.x = container.x + padding;
textField.y = container.y + padding;

 

 

    This topic has been closed for replies.

    1 reply

    Inspiring
    June 25, 2023

    It seems that with this code I solve the problem... in part, because the text is a little to the right... the x axis fails and the exact center is not left... this is how I modified the code. Let's see if someone knows why the x axis fails. thank you

    var ancho:Number = (stage.stageWidth/2 - container.width/2);
    var alto:Number =  stage.stageHeight/2 - container.height/2;
    container.x = ancho-container.width/2;
    container.y =alto-container.height/2;