How to custom the TextArea line background color - qt

I want to compare two TextArea's text ,and change the different text's line background color,but i don't know how can have tow background color in one TextArea. Maybe should custom to get it,what should i do?
or import .js to get it ? what should i do?

As a more advance solution, you can manipulate TextArea content with https://doc.qt.io/qt-5/qtextdocument.html QTextDocument. Original text document is available via this property https://doc.qt.io/qt-5/qml-qtquick-textedit.html#textDocument-prop . From this point, you can assign your own syntax highlighting. But it requires research from your side.
From the other side, you can check this example https://doc.qt.io/qt-5/qtwidgets-widgets-codeeditor-example.html and using this class https://doc.qt.io/qt-5/qsyntaxhighlighter.html you can assign the existing QTextDocument to QSyntaxHighlighter. The same, I guess, can be used for QML TextArea element.
Since TextArea has textDocument property it should be possible re-implement it for QtQuick Constrols.
To be honest I've never dealt with such a task, but this example looks pretty useful for such cases. Probably you should stick with rich text format option suggested in comments if you don't need advanced features (like real-time content changes).

Related

Change properties of graphic decoration ControlsFx

I am new in using the ControlsFx library and what i am trying to do is to adjust some properties of the ERROR_IMAGE from GraphicValidationDecoration. For example, I want to use the same image for validations, but with another positioning(default is bottom left) and another size. Is that posssible?
I tried using StyleClassValidationDecoration, but i think that's just for the textfield itself, not the icon i am talking about.
I read that this was also requested by the community but i did not find the implementantion for it (https://bitbucket.org/controlsfx/controlsfx/issues/788/make-style-of-graphicvalidationdecoration)

BIRT Report - Multiline text underlined to the full width

I'm trying to create a report with a layout as shown in the picture. The value of each field is underlined to the full width of the report. If it occupies more than one line each line is underlined. And there is also a short comment under the first line explaining the meaning of the field (shown in parentheses).
When we faced the same problem using JasperReports we had to create a custom component for that purpose. Does anyone know what the solution in BIRT might look like?
The only way I can think of is to calculate the line wrapping yourself, eg. converting your long text into a series of single lines.
Say you find a way to do this in a scripted data set, using the long text as an input.
You could then use a table item to render these single lines in the layout; using the bottom border to create the underlines (or possible an empty extra detail row with a top border and a height of 2pt to create nice line spacing).
Now how would this scripted data set look like?
I think when you study the source code of BIRT, you'll probably somewhere find a utility function that calculates the width (in whatever units) of a given text in a given font and size. Maybe this is also somewhere inside java.awt or inside iText (com.lowagie.text).
Then it is possible to call this function from inside Java Script and - with more or less logic - to use this as a basis for your scripted data set. But I think this will take a few hours to code.
If you manage to do this, it'd be nice if you post the solution here.

JavaFX disable TextArea scrolling

I have been trying to disable scroll bars in a text area using the code:
ScrollBar scrollBarv = (ScrollBar)textArea.lookup(".scroll-bar:vertical");
scrollBarv.setDisable(true);
But all I get is a null pointer for "scrollBarv". What am I missing?
You can't disable a scroll bar in a text area via lookups like you are trying to do.
A lookup is CSS based, which usually means it will only work after a CSS application pass has been applied. Generally, for a lookup to work as expected, a layout pass also needs to be applied on the parent node or scene. The logic in the JavaFX layout handlers for complex nodes such as controls may modify the CSS and nodes for the controls.
To understand how to apply CSS and perform a layout pass, read the relevant applyCss() documentation.
So you could do this:
textArea.applyCss();
textArea.layout();
ScrollBar scrollBarv = (ScrollBar)textArea.lookup(".scroll-bar:vertical");
scrollBarv.setDisable(true);
But even then, it would not do what you want. Because it is just a one-time call. If the user types new text into an empty TextArea until it fills the area, then a scroll bar will show up, and if the user deletes text in the text area, the scroll bar will be removed. And the new scroll bar which shows up wouldn't be found when you did your lookup because it would not have existed at that time.
Generally, the preferred alternative to performing lookups to nodes is to apply CSS style classes with the style class defining the desired attributes of the node regardless of the state it is in (and using psuedo-classes if state based CSS definitions are required). However, that probably won't work in this case as I can't see a definition for a disable attribute in the JavaFX CSS reference guide. Perhaps you might manage what you need via the visibility property, though that is unlikely as visibility is a bit different from disable.
The behavior for controlling the scroll bars is internally coded in the TextAreaSkin (which in Java 8 is not part of the public JavaFX API). You could copy or subclass the TextAreaSkin to customize its behavior and then attach your customized skin to your node. This is really the "proper" way to customize internal control behavior in the way in which you wish. A discussion of the detailed steps to achieve this is outside the scope of this answer.
But, in the end, I'm not sure how useful the behavior you desire is. Rather than disabling the vertical scroll bar, you could just disable the entire TextArea, which would be fine for most similar use-cases. Though, perhaps your use-case is different somehow in requiring only the vertical scroll bar to be disabled.

How to show table in alt message

I am creating a page in asp.net. I am trying to show some information in tabular format when user hovers on a inout button. To do this, I am setting alt attribute to input type button because it should be javascript independent. I tried creating a table and assigning it to the alt attribute as a text.
<input type="button" value="save" alt="<table><tr><td>some info </td></tr>
<tr><td>some other info </td></tr></table>"/>
But it is not displayed as a table with two ros. Instead it is displayed as a single line.
Is there any way to show it in tabular format?
This is not possible just like this. Alt can be just plain text.
You'll have to use JavaScript. Try to google for it :)
You'll have to:
Create table.
Using CSS, set it's position to absolute, near your control and display: none
On item hover, you have to set display: block.
Best for this kind of behavior is to use some Javascript framework, IE jquery
jquery.com
specially read these:
http://api.jquery.com/hover/
http://api.jquery.com/hide/
http://api.jquery.com/show/
Agreed with Ales, Javascript would make this a breeze. YUI's Tooltip allows you to instantiate a Tooltip associated with an element, or set of elements (changing the Tooltip's context, so in case you have many similar behaviours spread across a screen).
http://developer.yahoo.com/yui/examples/container/index.html
Once you have instantiated the Tooltip, its something like Tooltip.setBody("your HTML code");, though by default Tooltip sucks in title text of an <a> tag as its content, or possibly even alt text of an element - not 100% on the alt text default part though - good chance that if it doesn't do it by default, if you grab the alt attribute contents it will display it correctly inside the Tooltip.
Others have already told you that what you've asked for isn't possible, as HTML attributes must be plain text, not more HTML.
They've also told you that there are Javascript and JQuery libraries which will help you do what you're wanting to do. There are loads of scripts you could use, here's a link to one that you might want to try: http://bassistance.de/jquery-plugins/jquery-plugin-tooltip/
However, I feel I should add one further point which others have missed, and which is actually quite important:
You're using the wrong attribute.
The alt attribute is not the correct attribute to use for a hover tooltip effect. You should be using the title attribute for this.
Using alt works this way for historic reasons in some browsers (I believe it works in IE, but not much else), but it is not intended as a tooltip. The correct use of alt is for a small bit of descriptive text that will appear if the image is not loaded. This could be because the file failed to load, or the user has images turned off, or the user has a text-to-speech browser, etc, but if the image is displayed, then this text should never be displayed.
The title attribute on the other hand is intended to be displayed, and all browsers implement it as a tooltip (in fact, it's not just on <img> tags; you can use title for any element).
Hope that helps.

Flex: TextArea attached Image

Is there any advance TextArea that can attached image(image is alligned with the text) and the image can be movable inside the text area.I know that text area can support html text and can insert image tag but it is very limited, I can't move the picture inside textArea by dragging it or even add events on it.Is there any approach or solution or suggestion that you can give me?Your help guys is very much appreciated.
It should be possible using the new(ish) TextLayoutFramework (TLF), that came with CS5 and Flash builder 4 http://labs.adobe.com/technologies/textlayout/
It has advanced location information for letter possitions, and also supports inline images more like the way html does.
Also look at the textflow options from this developer: http://guyinthechair.com/tag/flash-text-engine/
Seems like you would only need to add the interaction layer to achieve your desied results and it might be easier to use.
It sounds like you would need to build a custom component for that functionality. Dragging an image around a TextArea is very non-standard behavior.
Flex documentation on custom components
Examples of custom components including a custom TextArea
The solution is TLF (text Layout Framework).
With TLF you can use TLF markup to send formatted text and images to a TextFlow. It's very powerful, but also complex. Here is a list of the tags you can use:
http://blogs.adobe.com/tlf/2009/09/tlf-markup-overview.html
I created a HTML Editor using it, and I'm impress with it. It supports image resizing, drag-n-drop, advanced formatting, etc.
Hope this helps!

Resources