[SOLUCIONADO] Textos PHP GD

TrinityCore · #1 (**permalink**) 16/04/2017, 09:54

Veran, necesito saber si existe alguna funcion no solo para colocar texto y darle un PosX/PosY, sino para darle un ancho y alto espesificos, ademas de que necesito que la fuente del texto sea autoadaptable.

En javascript cree una funcion que adapta el texto achicando la fuente 1punto cada vez que el contenedor del mismo se pasa de su altura estandar.

Esto es lo que quiero lograr con esta libreria PHP GD, por lo que necesito saber si existe funcion que me de el ancho y alto del contenedor donde estara dicho texto.

Espero me puedan ayudar. saludos!

Triby2 · #2 (**permalink**) 16/04/2017, 10:11

Mmm no tiene sentido una funcion que calcule las medidas del contenedor cuando éste se ha creado manualmente.

Para ajustar un texto y se convierta en dos o mas lineas segun el ancho del contenedor, tienes en css lo siguiente:

Código CSS:

Ver originalword-wrap: break-word;

Pero si lo que quieres es ajustar el texto en altura y largura, tienes que usar una imagen y controlar esos parametros con la propiedad size con los valores en %.

Si no es lo que buscas, entonces tendras que hacerlo mediante javascript. Consulta en ajustar_a_lo_ancho_un_texto_dentro_de_un_div_css_s olucionado-t359075.0.html

TrinityCore · #3 (**permalink**) 16/04/2017, 13:44

Creo que no me explique, esto lo necesito controlar con funciones en php, de nada me sirve lo relacionado con css, html o javascript.

Ya que lo que estoy haciendo es crear una imagen a partir de ensamblar varias...

Tal vez seria mejor dejar mi codigo para que puedan verlo y asi ver si me pueden ayudar.

Este codigo crea la imagen a partir de las demas:

Código PHP:

  <?php

// Incluir archivo que redimensiona las imagenes a un tamaño exacto.

include($_SERVER['DOCUMENT_ROOT'].'/redimensionar.php');

 
extract($_POST);

 
// Opciones de Template.

$CardType = array("Monster" => "0|0", "Ritual" => "836|0");

$CardValues = $CardType[$card_type];

$CardValues = explode("|", $CardValues);

if($card_type != "Monster"){

 
    $CardLeft = $CardValues[0] + 4;

    $CardTop = $CardValues[1];

 
}else{

 
    $CardLeft = $CardValues[0];

    $CardTop = $CardValues[1];

 
}

 
// Opciones de Atributo.

$attrType = array("divine" => 0, "fire" => 40, "light" => 80, "earth" => 120, "dark" => 160, "water" => 200, "wind" => 240, "trap" => 280, "magic" => 320);

 
// Evaluar imagen

$ImagenExtension = explode(".", $card_url);

$Total = count($ImagenExtension) - 1;

$ImagenExtension = $ImagenExtension[$Total];

$ImagenExtension = explode("/", $ImagenExtension);

$ImagenExtension = $ImagenExtension[0];

switch($ImagenExtension){

 
    case "png":

        $ImagenExtension = "png";

        break;

 
    case "jpeg":

    case "jpg":

        $ImagenExtension = "jpeg";

        break;

 
    case "gif":

        $ImagenExtension = "gif";

        break;

 
}

 
// Redimensionamos la imagen a usar.

ImageResize($card_url, 314, 310, "./images/descargas/carta.jpeg", 100, "$ImagenExtension");

 
// Incluir imagenes a usar.

$fondo = imagecreatetruecolor(418, 609); // Imagen nueva.

$template = @imagecreatefrompng("http://tenebron-wow.servegame.com/images/cards/image_create/template.png"); // template.

$attr = @imagecreatefrompng("http://tenebron-wow.servegame.com/images/cards/image_create/attrs.png"); // atributos.

$level = @imagecreatefrompng("http://tenebron-wow.servegame.com/images/cards/image_create/levels.png"); // level.

$imagen = @imagecreatefromjpeg("http://tenebron-wow.servegame.com/images/descargas/carta.jpeg");

 
// Textos.

$ColorTexto = imagecolorallocate($fondo, 0, 0, 0);

$FuenteTexto = "fonts/Voltaire-Regular.ttf";

 
 
// Superposicion de imagenes. \\

imagecopy($fondo, $template, 0, 0, $CardLeft, $CardTop, 419, 610); // Template

 
imagettftext($fondo, $card_fontsize, 0, 40, 64, $ColorTexto, $FuenteTexto, $card_name); // Nombre.

 
// Level

$LevelLeft = 0;

for($i = 0; $i < $card_level; $i++){

 
    imagecopy($fondo, $level, 347 - $LevelLeft, 84, 0, 0, 28, 28); // Level.

 
    $LevelLeft += 28;

 
}

 
imagecopy($fondo, $attr, 340, 34, $attrType[$card_attr], 0, 40, 40); // Atributo.

 
imagecopy($fondo, $imagen, 52, 127, 0, 0, 314, 310); // Imagen.

 
 
// Guardar resultado final.

imagepng($fondo, $_SERVER['DOCUMENT_ROOT'].'/images/descargas/carta.png');

 
// Liberar memoria.

imagedestroy($fondo);

imagedestroy($template);

imagedestroy($attr);

imagedestroy($level);

imagedestroy($imagen);

 
echo $card_name;

 
?>

Triby2 · #4 (**permalink**) 16/04/2017, 18:10

Pues entonces leete el css que controla ese div, asi sabras que tamaño tiene por cada redimensionamiento que tenga segun el dispositivo, como dije antes, no tiene logica una funcion para averiguar el tamaño de un div creado manualmente.

De todas formas, php no tiene esa funcion porque es del lado del servidor, tanto si existe una funcion predefinida para eso o no, solo lo podras averiguar el tamaño del div con un lenguaje del lado del cliente como javascript.

Tambien te digo que con php, solo podras crear la imagen pero no la vas a poder poner donde quieras en la web pues para eso esta el css y javascript.

Asi que el proceso, debe de ser ese, pasar las medidas de javasript a php mediante ajax, el php crea la imagen segun las medidas, y despues con ellos se deberia de reajustar la nueva imagen si has hecho un buen trabajo de css.

Aunque sinceramente eso es muy tedioso y va ocupar mucha memoria sin contar el tiempo de carga de la imagen.

Lo que yo suelo hacer en esos casos es crear la imagen 3 o 4 veces mas grande de lo que se va a ver en la pagina, y como al redimensionar a menos, no se pierde calidad de imagen, siempre se ve bien independientemente del tamaño del contenedor ya que me aseguro de hacer un buen trabajo con las @mediaqueries de css.

TrinityCore · #5 (**permalink**) 16/04/2017, 22:15

Es exactamente lo que estoy haciendo, pasando los valores de fuente mediante post por ajax...

El problema es que al crear la imagen en base al texto, esta se pasa de largo, y lo que busco es algo asi:

Esto es lo que hace php al crear la imagen en base al texto:

Lo que yo quiero, es que antes de crear la imagen, se puedan colocar minimamente \n en lugares clave para que el texto no pase de largo y obtener asi un formato parecido al del HTML y CSS.

Lo unico que aqui me complica es el tema de los saltos de linea como ya dije, la fuente se pasa por post, lo que no es un problema, los \n no se pasan por post, ya que al escribir en el textarea el texto hace sus saltos de linea necesarios, lo cual no es necesario andar dando intro. Y esto hace que llegado el String a php no sepa como manejarlo, ¿Alguna idea de como obtener el formato ideal antes de crear la imagen en base al texto?

saludos!

Triby2 · #6 (**permalink**) 17/04/2017, 10:01

Pues aqui lo ideal es que lo hagas mediante css, si tienes la fuente cargada en el site, solo utiliza el codigo de css que te pasé al principio y te olvidas.

Es lo que se suele hacer en estos caso, si el texto fuese fijo, pues obviamente no tendrias este problema pq seria parte de la imagen, pero comomdebe de ser diferente, entonces la mejor opcion y pas sencilla es la que te comento.

TrinityCore · #7 (**permalink**) 17/04/2017, 12:55

Creo que aun no me entiendes... Mi problema no viene desde html, css o javascript ya que eso se usa para el generador dinamico Front-End, sin importar si tu usas, css, javascript o lo que fuese, el string llega a php totalmente sin formato, lo cual el formato debe darse desde el fichero php Back-End, en el cual no se puede usar html, css, javascript... Solo las funciones de php como imagettftext()

De nada me sirve el codigo que me pasaste, porque nada tiene que ver con php y el problema que estoy planteando desde el comienzo del post.

Pero igualmente gracias por el interes.

(Actualizado):

Lo he solucionado de la siguiente forma:

Código PHP:

Ver original$TotalCaracteres = strlen($card_description);
$Limite = 30;
$NewDescription = "";
for($i = 0; $i < $TotalCaracteres; $i++){
 
    $NewDescription .= $card_description[$i];
 
    if($i == $Limite){
 
        $NewDescription = $NewDescription."\n";
 
        $Limite += 30;
 
    }
 
}

De esa manera controlo que el texto no se pase de largo, luego con la fuente controlo el tamaño para que no se pase de alto y con un par de condicionales controlare el largo y alto para determinados tamaño de fuente.

Triby2 · #8 (**permalink**) 19/04/2017, 05:09

Me alegra que lo hayas solucuonado.

Te entendí desde un principio, y te recomendé hacerlo por css porque te lleva menos trabajo el tema del texto porque al final, es un trabajo de front end porque el resultado se muestra del lado del cliente con lo cual se puede hacer por css y html.

Pero en fin, cualquier cosa se puede solucionar de muchas formas distinas, mas complejas o mas sencillas pero la finalidad es resolver.

TrinityCore · #9 (**permalink**) 19/04/2017, 14:54

Cita:

Iniciado por Triby2

Me alegra que lo hayas solucuonado.

Te entendí desde un principio, y te recomendé hacerlo por css porque te lleva menos trabajo el tema del texto porque al final, es un trabajo de front end porque el resultado se muestra del lado del cliente con lo cual se puede hacer por css y html.

Pero en fin, cualquier cosa se puede solucionar de muchas formas distinas, mas complejas o mas sencillas pero la finalidad es resolver.

Estas equivocado.... el resultado que se muestra es del generador de html, css y javascriptq ue funciona bien, mi proiblema era el de crear la imagen desde php, donde no se muestra nada del lado del cliente. Eso fue lo que no entendiste.

Si mirares el codigo, verias como se capturan variables por post y se crean las imagenes en base a esas cadenas, y verias tambien que en ningun momento el codigo retorna al lado del cliente, sino que entra desde el cliente en php, pero entra sin formato, tomando cualquier cosa de css y html como literal lo que impide la utilizacion de los mismos.

Es decir, el resultado no se muestra del lado del cliente, lo que se muestra es un generador dinamico que sirve solo como vista previa de lo que sera la imagen generada.

saludos y gracias igual.

Triby2 · #10 (**permalink**) 20/04/2017, 08:44

Cita:

Iniciado por TrinityCore

Estas equivocado.... el resultado que se muestra es del generador de html, css y javascriptq ue funciona bien, mi proiblema era el de crear la imagen desde php, donde no se muestra nada del lado del cliente. Eso fue lo que no entendiste.

Si mirares el codigo, verias como se capturan variables por post y se crean las imagenes en base a esas cadenas, y verias tambien que en ningun momento el codigo retorna al lado del cliente, sino que entra desde el cliente en php, pero entra sin formato, tomando cualquier cosa de css y html como literal lo que impide la utilizacion de los mismos.

Es decir, el resultado no se muestra del lado del cliente, lo que se muestra es un generador dinamico que sirve solo como vista previa de lo que sera la imagen generada.

saludos y gracias igual.

Ok, haber especificado que tu proyecto no es para que el publico lo visione, sino quees solo para crear imagenes para tu propio uso. Generalmente todos aqui hacemos algo donde el resultado final se muestre al cliente y no se quede en el servidor, por eso mismo te recomendé el uso de tecnologias del lado de cliente pues pensaba que sería para algún tipo de juego online.

Mil disculpas