Styling paragraphs/lines?

[richmond62]

Are you wedded to using the border-whatevers?

Personally, after Zak's OP, I am not 'wedded', but I am 'in a relationship', as it does seem a good thing, if it is at all possible.

[Zax]

I tried again using numToChar(11) and it seems to work.

Code: Select all

on mouseup
   replace cr with numToNativeChar(11) in fld 1
   set the borderwidth of paragraph 1 to 4 of fld 1 to 3 -- > ok
end mouseup

But we have to replace all CRs typed/pasted by users, and it add complexity.

Field script:

Code: Select all

on returnInField
   put numToNativeChar(11) into the selection
end returnInField

I am thinking about using an overlay and modifying its properties to fit. Maybe a field with just the right backColor, borderColor, borderWidth and blendlevel? That way it is a single control not subject to the line and paragraph constraints you are seeing. You can easily size and locate it to fit.

I don't understand your proposal Craig. Could you explain?

[richmond62]

But we have to replace all CRs typed/pasted by users, and it add complexity.

Doesn't that mean that your border will go round all the text, not just the paragraphs you want?

[Zax]

Doesn't that mean that your border will go round all the text, not just the paragraphs you want?

Oops! Right, that would involve placing CRs in the desired locations, and that would definitely be too complex and not robust enough.

[richmond62]

One of the things that interests me as an English teacher is what, in LiveCode constitutes a paragraph.

In English a paragraph can be represented in 2 distinct ways:

1. Each new paragraph is represented by a carriage return and an indentation (Tab key).

2 Each new paragraph is represented by a double carriage return (i,e, an empty line between each paragraph).

I made a stack with 2 fields with exactly the same text with the 2 styles of border:

Code: Select all

on mouseUp
   set the borderColor of paragraph 2 of fld "f1" to red
   set the borderColor of paragraph 2 of fld "f2" to red
   set the borderwidth of paragraph 2 of fld "f1" to 4
   set the borderwidth of paragraph 2 of fld "f2" to 4
end mouseUp

-

-

Code: Select all

on mouseUp
   set the borderColor of paragraph 2 to 3 of fld "f1" to green
   set the borderColor of paragraph 2 to 3 of fld "f2" to green
   --
   set the borderwidth of paragraph 2 to 3 of fld "f1" to 4
   set the borderwidth of paragraph 2 to 3 of fld "f2" to 4
   end mouseUp

-

-
Obviously it is better to stick to method #1 of representing paragraphs.

[richmond62]

Code: Select all

on mouseUp
 put paragraph 2 to 3 of fld "f1" into PARAS1
   delete paragraph 2 to 3 of fld "f1"
   replace cr with numToNativeChar(11) in PARAS1
   put cr & PARAS1 & cr after paragraph 1 of fld "f1"
   set the borderwidth of paragraph 2 of fld "f1" to 4
   set the bordercolor of paragraph 2 of fld "f1" to "purple"
   end mouseUp

-

-
I think I'll just pop outside and bang my head against the wall for a bit.

[dunbarx]

Zax.

I threw this stack together. It places an overlay between any two lines that you click on. It is hardly polished, in that it does not use typical field properties to set spatial parameters (as it ought), rather, I just jury-rigged some stuff into place.

It is a kludge, in that it sidesteps all that paragraph and return stuff. This may not be a grown-up way to do this.

Craig

MakeOverlay.livecode.zip

(1.18 KiB) Downloaded 116 times

[Zax]

Thanks Craig, that’s a smart solution

However, if I want to be a perfectionist, placing a semi-transparent element on top of text decreases the contrast of the text and it is no longer black.
This is the difference with the concept of background, where the color is placed in a layer lower than the text.
What you are proposing is more highlighting, which can be very interesting in certain cases.

[richmond62]

A simpler way to put borders round whatever text you want works like this:
-

-

Code: Select all

on mouseUp
   put the selectedText into SELEX
   replace cr with numToNativeChar(11) in SELEX
   delete the selectedText
   put SELEX after the selectedText
   set the borderwidth of the selectedText to 4
   set the bordercolor of the selectedText to "red"
   select after fld "f1"
end mouseUp

[Zax]

Nice

This is a simplified version:

Code: Select all

on mouseUp
   put the selectedText into savedText
   replace cr with numToNativeChar(11) in savedText
   put savedText into the selectedText
   
   set the borderwidth of the selectedText to 4
   set the bordercolor of the selectedText to "red"
end mouseUp

[dunbarx]

However, if I want to be a perfectionist, placing a semi-transparent element on top of text decreases the contrast of the text and it is no longer black.

I only colorized the backGround because one or more of the previous posts showed that. You do not have to.

Craig

[bn]

Hi Zax,

I used Dunbarx stack and modified it a bit.

I used the field "overlay" to mark text. I made it scrollable (see script of main field) also you can put the overlay field in front of main field or behind the main field (obviously not when the main field is opaque.

If the overlay is in front of the main field I set the "ink" to "blendDarken". This way the text of the main field is always crisp irrespective of the blend level of field overlay.

See the options and scripts.

It is still a hack and has its limitations.

[dunbarx]

Bernd.

The scrolling is nice.

I was never satisfied with the method of selecting the start and end lines. Your update does not have this feature at all.

But I like the following, modifying "our" makeOverlay button script:

Code: Select all

on mouseUp
   put word 2 of the selectedlines into tStartLine
   put word 4 of the selectedLines into tEndLine
   put the formattedRect of line tStartLine to tEndLine of field fText into tRect
   set the rect of field "overlay" to tRect
   ## set a custom property of field "overlay" to reference it 
   ## in script of field "fText" for scrolling
   set the uStartLine of field "overlay" to tStartLine
   set the uEndLine of field "overlay" to tEndLine
end mouseUp

Now all the user has to do is select some lines of the text of the field, and the button will set that up. Needs a little houseKeeping, though.

Craig

MakeOverlay_3.livecode.zip

(1.84 KiB) Downloaded 104 times

[bn]

Craig,

that looks nice and all your script needs is a "select empty" after getting the formattedRect.

Kind regards
Bernd

[dunbarx]

Bernd.

Test, test, test. Anyway, this sure beats working.

Had to modify the button script since if the user selects only a single line, the "format" of the "selectedLines" changes:

Code: Select all

on mouseUp
   put the selectedlines into tSelectedLines
   put word 2 of tSelectedLines into tStartLine
   if tSelectedLines contains "to" then put word 4 of tSelectedLines into tEndLine --"to" only appears with multi-line selections
   else put word 2 of tSelectedLines into tEndLine  --same line
   
  ....

Craig

MakeOverlay_4.livecode.zip

(1.91 KiB) Downloaded 106 times