I tried to run Webview richtext display with below code given in the referance document but it gives empty page.
Did something wrong on the code or just does not support webview rich text?
Pages.Page1.webView1 = new SMF.UI.WebView({
top : "5%",
left : "5%",
width : "90%",
height : "90%",
URL : "Lorem ipsum dolor sit amet, consectetur adipiscing elit. "
});
Pages.Page1.add(Pages.Page1.webView1);
You should assign your rich text as HTML to the URL to display a rich text paragraph in a Webview.You can add as below:
Pages.Page1.webView1 = new SMF.UI.WebView({
top : "5%",
left : "5%",
width : "90%",
height : "90%",
URL : "<p>Lorem ipsum dolor sit amet, <strong>consectetur adipiscing elit.</strong><mark>Nummus in Croesi divitiis obscuratur,</mark> pars est tamen divitiarum. Utrum igitur tibi litteram videor an totas paginas commovere?</p>"
});
Pages.Page1.add(Pages.Page1.webView1);
Related
I have a List that contains lottery numbers
List image
How can I separate number and text, and after that list them in the below list: for example:
List<String> n = ["ABC23", "21A23", "12A312","32141A"];
Thank you!
You can do it by using forEach like below:
List<String> n = ["23", "2123", "12312","32141"];
n.forEach((element) =>
print(element)
);
And to separate number and text you can use the following code:
const text = '''
Lorem Ipsum is simply dummy text of the 123.456 printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an 12:30 unknown printer took a galley of type and scrambled it to make a
23.4567
type specimen book. It has 445566 survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.
''';
final intRegex = RegExp(r'\s+(\d+)\s+', multiLine: true);
final doubleRegex = RegExp(r'\s+(\d+\.\d+)\s+', multiLine: true);
final timeRegex = RegExp(r'\s+(\d{1,2}:\d{2})\s+', multiLine: true);
void main() {
print(intRegex.allMatches(text).map((m) => m.group(0)));
print(doubleRegex.allMatches(text).map((m) => m.group(0)));
print(timeRegex.allMatches(text).map((m) => m.group(0)));
}
Please refer to this link for more information.
To do something with each element:
List<String> n = ["23", "2123", "12312","32141"];
n.forEach((element) {
int number = int.parse(element);
...
}
);
To do create list of ints:
List<String> n = ["23", "2123", "12312","32141"];
final intList = n.map((element) => int.parse(element)).toList();
I have an array of notes (viewModel.list) that I would like to display in a List. All notes conform to Identifiable.
When I use ForEach, all notes appear just fine:
ForEach(viewModel.list){ note in
NoteView(namespace:namespace, note: note)
}
But if I change this to a List no objects appear:
List(viewModel.list){ note in
NoteView(namespace:namespace, note: note)
}
The same thing happens if I embed the ForEach in a List
List{
ForEach(viewModel.list){ note in
NoteView(namespace:namespace, note: note)
}
}
I want to use a List because I would like to add a swipeAction to every NoteView which can only be used in Lists. Is there any reason this behavior is happening?
UPDATE: I have uploaded a reproducible example below and believe it has something to do with embedding the List in a ScrollView. If I remove the ScrollView, this code works fine, but nothing shows up with it.
import SwiftUI
struct Note: Identifiable {
var id = UUID()
var content: String = ""
}
var notes = [
Note(content: "Lorem ipsum dolor sit amet, consectet adipiscing elit. Condimentum quisque id vitae convallis dignissim pharetra nisl est creatus"),
Note(content: "Mauris ac tempor libero, non eleifend lectus. Mauris eu hendrerit nunc. Donec at ante mauris. Duis ac elit purus. Mauris ullamcorper mi."),
Note(content: "Lorem ipsum dolor sit amet, consectet adipiscing elit. Condimentum quisque id vitae convallis dignissim pharetra nisl est creatus"),
Note(content: "Mauris ac tempor libero, non eleifend lectus. Mauris eu hendrerit nunc. Donec at ante mauris. Duis ac elit purus. Mauris ullamcorper mi.")
]
struct ContentView: View {
var body: some View {
ScrollView {
List(notes){ note in
NoteView(note: note)
.padding(.bottom)
}
}
}
}
struct NoteView: View {
var note: Note = notes[0]
var body: some View {
Text(note.content)
}
}
List is not showing because List infer it size from its parent View. So when you embed it inside something like Scrollview that have dynamic height, it can't infer it size correctly.
Also List behaves like a UIScrollView (an arbitrarily long scrollable view of views).
So no need to wrap List inside scrollview.
struct ContentView: View {
var body: some View {
// ScrollView {
List(notes){ note in
NoteView(note: note)
.padding(.bottom)
}
// }
}
}
Just remove List from ScrollView - it is scrollable itself.
struct ContentView: View {
var body: some View {
List(notes){ note in
NoteView(note: note)
.padding(.bottom)
}
}
}
*the reason of the issue is that List wants to take parent size to expand, but ScrollView does not have own size and expects from content a size that needs to be scrolled, result is obvious - cycling conflict - to do not crash/hang in cycling SwiftUI breaks layout - output is empty.
I have a row with 3 columns containing cards, the b-card-text (text in the cards) is not equal in length thus making the cards differ in height. Question is how do I make the cards match in height?
Tried adding h-100 d-inline-block classes to the cards but no luck.
<b-row>
<b-col class md="4">
<b-card>
<b-card-text>Lorem Ipsum is simply dummy text of </b-card-text>
</b-card>
</b-col>
<b-col class md="4">
<b-card class="h-75 d-inline-block">
<b-card-text>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make
</b-card-text>
</b-card>
</b-col>
<b-col class md="4">
<b-card>
<b-card-text>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard
</b-card-text>
</b-card>
</b-col>
</b-row>
I expect the cards to be the same in height.
On the <b-row> add the class class="align-self-stretch", or to make it applicable to only md and up breakpoints: class="align-self-md-stretch". And then use the utility class h-100 on each <b-card>
Example: https://jsfiddle.net/ofcxrquz/
See:
https://bootstrap-vue.js.org/docs/reference/utility-classes
https://getbootstrap.com/docs/4.3/utilities/flex/#align-self
I have a simple question. I'm trying to use animation on a single page such as Page1. For example if I change the Label text and press a TextButton, I would like it to transition leftToRight. When I try to use the Pages.Page1.show(3,4,0,false,false), the updated label is shown with no transition effect. I've tried to go between 2 different pages and it does transition properly. Is there a way to do this with 1 page since I want to keep the same page elements but just update the text content and display the updated page with a transition effect.
You can not run page animation for the same page. But you can try something like that.
Just run animate method only for the updated object. For example;
var myLabel = new SMF.UI.Label({
top : "25%",
left : "15%",
height : "10%",
width : "70%",
text : "hello"
});
var myButton = new SMF.UI.TextButton({
top : "50%",
left : "15%",
height : "10%",
width : "70%",
text : "myButton",
onPressed : function () {
myLabel.alpha = 0;
myLabel.text = "world";
myLabel.animate({
property : "alpha",
endValue : 100,
motionEase : SMF.UI.MotionEase.plain,
duration : 3000,
onFinish : function () {
//do your action after finishing the animation
}
});
}
});
Add these two objects(myLabel, myButton) to your page.
When pressed to button, label's text changes, it becomes invisible with alpha = 0, and then it becomes visible again with animate method.
I want to have a Clutter.Text displaying text with double line spacing using Gtk.Pango.
note : in css, we would use line-height: 200% I think.
I tried this code and it didn't work:
var text_actor = new Clutter.Text.with_text ("Roboto 10", "Long long text") ;
text_actor.width= SIDE_PANE_WIDTH ;
text_actor.get_layout ().set_spacing (2*Pango.SCALE) ;
Apparently, Clutter.Text keeps a cached version of the Pango.Layout
Is there a way to achieve this?
One way working around this by using CoglPango directly:
var t = new Clutter.Actor ();
t.set_size (300, 300);
// add some more text to see it
var text = "Lorem ipsum dolor sit amet, consectetur adipisicing elit, ...";
var layout = t.create_pango_layout (text);
layout.set_width (200);
layout.set_spacing (24 * Pango.SCALE);
t.paint.connect (() => {
Cogl.pango_render_layout (layout, 0, 0,
Cogl.Color.from_4ub(0, 0, 0, 255), 0);
});
edit this is indeed the solution. Based on this, here's the code that I used:
actor = new Text () ;
actor.width= SIDE_PANE_WIDTH ;
var text = "Some long text<b>Bold</b>" ;
var pango_layout = bio_actor.create_pango_layout ("");
pango_layout.set_markup (text, text.length) ;
pango_layout.set_spacing (2 * Pango.SCALE);
pango_layout.set_font_description (Pango.FontDescription.from_string ("Roboto 10")) ;
pango_layout.set_width (SIDE_PANE_WIDTH * Pango.SCALE);
bio_actor.paint.connect (() => {
Cogl.pango_render_layout (pango_layout, 0, 0, Cogl.Color.from_4ub(255, 255, 255, 255), 0);
});
int width;
int height ;
pango_layout.get_size (out width, out height) ;
actor.height = height / Pango.SCALE;
Yes, ClutterText caches the PangoLayout instance to avoid having to re-measure text every time it has to retrieve the preferred size. It actually caches the latest three instances of PangoLayout, because of the width-for-height/height-for-width geometry requests, but that's just an implementation detail.
Changing properties on the PangoLayout instance of ClutterText is also not going to result in updates to the ClutterText: you'd have to call clutter_actor_queue_redraw() afterwards, as the PangoLayout sits at a lower level than the actor in the scene graph.
In general, the ClutterText actor does not allow you to tweak the PangoLayout it creates; it's expected that the actor is in charge of creating an modifying the layout, and attempts at overriding that will result in either poor performance or undefined behaviour.
If you want to introduce a line spacing property then you'll have to file a bug against ClutterText — though that would mean that you'd have to wait until September for the next stable release of Clutter.
If you don't need all that ClutterText does, and you just want to display text, you could subclass ClutterActor and use clutter_actor_create_pango_layout() to create a PangoLayout that you can measure inside the overridden get_preferred_width(), get_preferred_height(), and allocate() virtual functions, and paint inside the overridden paint() virtual function.