• Global community
    • Language:
      • Deutsch
      • English
      • Español
      • Français
      • Português
  • 日本語コミュニティ
    Dedicated community for Japanese speakers
  • 한국 커뮤니티
    Dedicated community for Korean speakers
Exit
Locked
0

How to draw a Stroke under each line

Engaged ,
Feb 08, 2012 Feb 08, 2012

Copy link to clipboard

Copied

How do I draw a line (Stroke) under each line?

Background

I'm trying to get the appearance of notebook paper. I'm using the Spark TextArea. I've tried a number of different approaches and all of them have drawbacks.

TOPICS
Text layout framework

Views

3.4K

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Adobe Employee ,
Feb 08, 2012 Feb 08, 2012

Copy link to clipboard

Copied

I guess you may dislike textDecoration format.

7.3.7. textDecoration attribute

<xs:attributename="textDecoration"type="xs:string"default="none."/>

The text decoration to apply. Valid values include:

• none
• underline

Without help of textDecoration, you may want to retrieve "y" values for all flash.text.engine.TextLine upon TextArea to draw those lines on your own.

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Engaged ,
Feb 09, 2012 Feb 09, 2012

Copy link to clipboard

Copied

I'm going more for a background look rather than text-underline. 

I've retrieved the text lines through the following code:

                textContainerManager = textDisplay.mx_internal::textContainerManager;

                if (textDisplay.getStyle("lineHeight")) {

                    lineHeightRatio = parseInt(textDisplay.getStyle("lineHeight"))/100;

                }

                textLines = new Vector.<DisplayObject>(linesLength);

                linesLength = textContainerManager.numLines;

                linesLength = textContainerManager.tlf_internal::getActualNumLines();

The linesLength using numLines usually returns a smaller number than getActualNumLines(). I'm guessing because the non-visible lines are being reused.

Right now I'm using the graphics object of parent Spark Group container and draw lines on that by iterating through the text lines and getting the y value as you stated. The problem I'm having with this is to know when to draw the lines and if the TextLine is null then extrapolating out the correct coordinates, which I've done to some success.

Another cleaner approach I was thinking about is to extend TextLine where in the updateDisplayList method draw the line and then apply the ExtendedTextLine to the TextLineFactory(?)? I looked into it and could not find it. My skill is in Flex component lifecycle so I don't know if TextLine has a updateDisplayList method. Is this the right approach to solve this problem?

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Adobe Employee ,
Feb 09, 2012 Feb 09, 2012

Copy link to clipboard

Copied

The problem I'm having with this is to know when to draw the lines and if the TextLine is null then extrapolating out the correct coordinates, which I've done to some success.

TLF draws background by flashx.textLayout.BackgroundManager. For TextArea, the specific function is BackgroundManager.drawAllRects(), which is the perfect place. Otherwise, bugs occur easily.

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Engaged ,
Feb 10, 2012 Feb 10, 2012

Copy link to clipboard

Copied

Where is this located? I searched for those classes and methods on TextArea and SkinnableTextBase and couldn't find them.

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Adobe Employee ,
Feb 12, 2012 Feb 12, 2012

Copy link to clipboard

Copied

It's in textLayout.swc of Flex SDK. flashx.textLayout.BackgroundManager

To modify the code there and make it work in your way, you need to replace that swc with your custom one. Or you just include source code of textLayout.swc in your project.

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Engaged ,
Feb 15, 2012 Feb 15, 2012

Copy link to clipboard

Copied

I have not been able to get it to work. I have copied the src into my project (removed the textLayout.swc) with no warnings but the flashx.textLayout.BackgroundManager drawAllRects is never called from anywhere.

Note for posterity:

To get it to compile I had to add -define=CONFIG::debug,false -define=CONFIG::release,true (or true / false) to the compiler options.

Also, in the constructor of some classes this class was causing compiler errors:

        public function IntPropertyHandler(minValue:int,maxValue:int,limits:String = Property.ALL_LIMITS)

It had to be changed to:

        public function IntPropertyHandler(minValue:int,maxValue:int,limits:String = "allLimits")

Also there was a conflict where a variable had to be cast to a ContextMenu because of a NativeMenu error.

Note

I've tried to set my own containerController but getController returns null if the container controller does not extend TMContainerController. The problem is you can't extend TMContainerController because it is a non public inner class in TextContainerManager. 

        private function getController():TMContainerController

        { return _textFlow.flowComposer.getControllerAt(0) as TMContainerController; }

Can it be ContainerController?

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Adobe Employee ,
Feb 15, 2012 Feb 15, 2012

Copy link to clipboard

Copied

LATEST

When background is set, drawAllRects() or onUpdateComplete() will definitely be called. The stroke is supposed to be drawn at that time, when TLF is drawing background.

flashx.textLayout.BackgroundManager drawAllRects() is called only when 1) you set background and 2) the container is a kind of TCM. textarea should be a TCM.

PS: The active participants on this sub-forum only focus on classes in textLayout.swc.

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines