1. #1
    Sencha User
    Join Date
    Aug 2013
    Posts
    2
    Vote Rating
    0
    mahir9903 is on a distinguished road

      0  

    Default Unanswered: GXT drawing - TextSprite metric

    Unanswered: GXT drawing - TextSprite metric


    I need to get TextMetrics of TextSprite. So how can I bind TextSprite to TextMetric, TextMetric get XElement, Element as paramater. Please help me, I need my TextSprite width, height only

  2. #2
    Sencha - GXT Dev Team
    Join Date
    Feb 2009
    Location
    Minnesota
    Posts
    2,732
    Answers
    109
    Vote Rating
    90
    Colin Alworth is a glorious beacon of light Colin Alworth is a glorious beacon of light Colin Alworth is a glorious beacon of light Colin Alworth is a glorious beacon of light Colin Alworth is a glorious beacon of light

      0  

    Default


    The short version is that isn't how TextMetrics works. The purpose of TextMetrics is to tell you how big the text will be when drawn on some html element, perhaps with a class name set.

    Sprites in general (and TextSprites in particular) are not drawn with html elements (either SVG or VML today) and may not be drawn with DOM elements at all (we're working on a Canvas implementation), so it doesn't make sense to use these together.

    Instead, two options:
    * Just use text metrics to find out how big the text would be with the settings (font, size, weight, etc) you are using on the sprite, or
    * Use the Sprite' getBBox() method to find out how big the sprite will be once drawn on the page and ask that rectangle for its width. Note that this will account for other transformations such a rotation, etc.

  3. #3
    Sencha User
    Join Date
    Aug 2013
    Posts
    2
    Vote Rating
    0
    mahir9903 is on a distinguished road

      0  

    Default


    Thanks for reply. I understood that sprites are not html element. but For your first option, I wanna ask that, which gwt, gxt,or sencha element or component can I take and set style (font, size, etc) then bind to textmetrics? , after that get metrics. if possible, any piece of sample code for text metric width these styles.

    For second option, I think getBBox() evaluated after rendering drawcomponent, so when I have
    TextSprite text = new TextSprite();
    text.setText("Sample text");
    text.setFontWeight(com.google.gwt.dom.client.Style.FontWeight.BOLD);
    text.setFont("Tahoma");
    text.setFontSize(18);
    if I after that I use getBBox I will get text.getBBox().getHeight() always equal to 0, or getWidth()=0 because it isnt evaluated. because it is not rendering on surface. and I dont want to add it to drawcomponent, I need width and lineheight before rendering, so it doesnt give anything.

    And I wanna say that my purpose is word wrapping on textsprite, so I am interesting on textmetrics. if you know another option

    Thanks for all

  4. #4
    Sencha - GXT Dev Team
    Join Date
    Feb 2009
    Location
    Minnesota
    Posts
    2,732
    Answers
    109
    Vote Rating
    90
    Colin Alworth is a glorious beacon of light Colin Alworth is a glorious beacon of light Colin Alworth is a glorious beacon of light Colin Alworth is a glorious beacon of light Colin Alworth is a glorious beacon of light

      0  

    Default


    If the sprite is not owned by a surface, it won't be measured at all - why are you making a sprite if you don't want it to be attached to a surface? Are you just curious about how big the text will be when drawn, but don't want to draw it?

    If you just simply use TextMetrics and leave TextSprite out of it, then use the bind methods to specify the details about how you are rendering. For example, if you have a css class that describes the circumstances you want to measure, then invoke bind(myClass). If on the other hand you have an element with the particular styles set on it, you can bind the element itself. If you just have a bunch of settings, create an element and set them on that element.

    "word wrapping" is a little vague - by default TextMetrics won't do any wrapping at all, since it doesnt set a width. You can set a width with the setFixedWidth method, and then measure the height to see how long that line ends up being.

    Code:
    //create element and set properties
    Element div = DOM.createDiv();
    div.getStyle().setFontSize(16, Unit.PX);
    //etc...
    
    //bind
    TextMetrics.get().bind(div);
    
    //measure
    TextMetrics.get().getWidth(text);

Thread Participants: 1

Tags for this Thread