Silly question, but a Google/SO search didn't bring me the desired result. I have a very long string like this:
<Label Text="Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet."
VerticalOptions="Start"
HorizontalOptions="StartAndExpand" />
How can I break up the Text attribute on multiple lines to have a better code formatting? Is there an option or not?
If I enter a new line and add some spaces (for indenting), the label also contains the spaces ...
It's funny I've not really thought about this one before but it's a great question! I always just kept word wrap on the editor so I never noticed...
That looks like xamarin? If so you might add that tag since wpf etc would be <Label Content="blah"/> format so it confused me at first.
However, in WPF, Silverlight, UWP, etc, you can just do this and skip the measuring of the ContentPresenter to display as a whole line and wrap accordingly when rendered;
<Label>
Lorem ipsum dolor sit amet, consetetur sadipscing elitr,
sed diam nonumy eirmod tempor invidunt ut labore et dolore
magna aliquyam erat, sed diam voluptua. At vero eos et accusam
et justo duo dolores et ea rebum. Stet clita kasd gubergren,
no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem
ipsum dolor sit amet, consetetur sadipscing elitr, sed diam
nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam
erat, sed diam voluptua. At vero eos et accusam et justo duo
dolores et ea rebum. Stet clita kasd gubergren, no sea takimata
sanctus est Lorem ipsum dolor sit amet.
</Label>
Unfortunately I don't use xamarin currently so if it turns out to be different just me know and I'll del this answer but hope it helps.
This problem has nothing to do with Xamarin. I use WPF and I had the same problem.
The problem does not only occur in a Label, it is in all Controls. Every Control has a Text property.
The cause is that you use the Text property to assign your text, using Text="..."
The solution, as Chris W suggested (maybe without realizing it), is to move the assignment of the Text property to the part between the opening tag and the closing tag; so to the part between <...> and </...>
So Instead of
<TextBox Height="auto" TextWrapping="Wrap"
Text="Lorem ipsum dolor sit amet, consetetur ... (etc.)"/>
Use:
<TextBox Height="auto" TextWrapping="Wrap">
Lorem ipsum dolor sit amet, consetetur sadipscing elitr,
sed diam nonumy eirmod tempor invidunt ut labore et dolore
... (etc.)
<TextBox>
Even the spaces / tabs in front of the text will be replaced by one space.
Note that if you use property assignment, you use string quotes: Text="...";
If you use the part between opening and closing tag, there are no string quotes.
That might be the reason that you can add line breaks in your source code.
Related
I was wondering why my react native if i wrap scrollview with gesture detector, I'm unable to scroll on android but able to scroll on ios. I was wondering how I can make my scrollview work on android.
Thanks!
const gest = Gesture.Pan().onUpdate((e) => {...})
return(
<GestureDetector gesture={roomGestureTV}>
<ScrollView ... />
</GestureDetector>
)
Here is a Snack that shows how to wrap a ScrollView with a PanGesture (Snack or below for future reference). I have tested the code on a Galaxy S9 (Android) and iPhone 13 (Real and Emulator).
Some notes (See the snack first!):
The behaviour for android and IOS gestures differs, because they (react-native-gesture-handler) had to implement a custom solution on Android but not on IOS. On Android the pan gesture cancels the ScrollView gesture, but on IOS the ScrollView cancels the PanGesture. In both cases PanGesture and Scroll gesture do not work simultanously out of the box.
Use createNativeWrapper instead of the ScrollView from gesture handler. While the ScrollView from gesture handler will work, other components that build on ScrollView will not (e.g. FlatLists). In order to use a FlatList instead of a ScrollView, exchange the ScrollView with a FlatList in createNativeWrapper
createNativeWrapper is no longer activly supported by the libary (Source). However, the new/old Native Gesture Component is not working for this use case (at least for me). This might be a bug and might be fixed in newer versions.
Note that simultaneousHandlers for the ScrollView is not limited to one gesture but can accept multiple gestures. E.g. it is possible to have a pan and pinch gesture while scrolling.
Reference Code
import React, { useRef } from 'react';
import { Text, View, ScrollView } from 'react-native';
import Animated, {
useDerivedValue,
useSharedValue,
useWorkletCallback,
} from 'react-native-reanimated';
import {
createNativeWrapper,
GestureHandlerRootView,
Gesture,
GestureDetector,
} from 'react-native-gesture-handler';
import ReText from './components/ReText';
/**
* Gesture states
* (see https://docs.swmansion.com/react-native-gesture-handler/docs/under-the-hood/states-events)
*/
const STATES = {
0: 'UNDETERMINED',
1: 'FAILED',
2: 'BEGAN',
3: 'CANCELLED',
4: 'ACTIVE',
5: 'END',
};
const CustomScrollComponent = createNativeWrapper(ScrollView)
export default function App() {
const panRef = useRef(null);
const scrollRef = useRef(null);
// Log values
const touchPosition = useSharedValue({ x: null, y: null });
const touchPositionX = useDerivedValue(() => {
return `x: ${touchPosition.value.x}`;
});
const touchPositionY = useDerivedValue(() => {
return `y: ${touchPosition.value.y}`;
});
const state = useSharedValue([STATES[0], 'null', 'null']);
const stateString = useDerivedValue(() => {
return `${state.value[0]}\n${state.value[1]}\n${state.value[2]}`;
});
const appendState = useWorkletCallback((arr, value) => {
return [value].concat(arr.slice(0, 2));
}, []);
const panGesture = Gesture.Pan()
.onBegin((e) => {
state.value = appendState(state.value, STATES[e.state]);
})
.onStart((e) => {
state.value = appendState(state.value, STATES[e.state]);
})
.onUpdate((e) => {
if (state.value[0] !== STATES[e.state]) {
state.value = appendState(state.value, STATES[e.state]);
}
touchPosition.value = { x: e.absoluteX, y: e.absoluteY };
})
.onEnd((e) => {
state.value = appendState(state.value, STATES[e.state]);
})
.onFinalize((e) => {
state.value = appendState(state.value, STATES[e.state]);
touchPosition.value = { x: null, y: null };
})
.simultaneousWithExternalGesture(scrollRef)
.withRef(panRef);
return (
<GestureHandlerRootView style={{ flex: 1 }}>
<View style={{ flex: 1 }}>
{/** Logger */}
<View style={{ padding: 16, height: 180, justifyContent: 'flex-end' }}>
<ReText text={touchPositionX} />
<ReText text={touchPositionY} />
<Text>Gesture States (New -> Old):</Text>
<ReText text={stateString} />
</View>
{/** ScrollView with pan gesture */}
<GestureDetector gesture={panGesture}>
<Animated.View style={{ flex: 1 }}>
<CustomScrollComponent
disallowInterruption={false}
scrollEnabled={true}
ref={scrollRef}
style={{ flex: 1 }}
simultaneousHandlers={panRef}>
<Text>
Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed
diam nonumy eirmod tempor invidunt ut labore et dolore magna
aliquyam erat, sed diam voluptua. At vero eos et accusam et
justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea
takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum
dolor sit amet, consetetur sadipscing elitr, sed diam nonumy
eirmod tempor invidunt ut labore et dolore magna aliquyam erat,
sed diam voluptua. At vero eos et accusam et justo duo dolores
et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus
est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet,
consetetur sadipscing elitr, sed diam nonumy eirmod tempor
invidunt ut labore et dolore magna aliquyam erat, sed diam
voluptua. At vero eos et accusam et justo duo dolores et ea
rebum. Stet clita kasd gubergren, no sea takimata sanctus est
Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet,
consetetur sadipscing elitr, sed diam nonumy eirmod tempor
invidunt ut labore et dolore magna aliquyam erat, sed diam
voluptua. At vero eos et accusam et justo duo dolores et ea
rebum. Stet clita kasd gubergren, no sea takimata sanctus est
Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet,
consetetur sadipscing elitr, sed diam nonumy eirmod tempor
invidunt ut labore et dolore magna aliquyam erat, sed diam
voluptua. At vero eos et accusam et justo duo dolores et ea
rebum. Stet clita kasd gubergren, no sea takimata sanctus est
Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet,
consetetur sadipscing elitr, sed diam nonumy eirmod tempor
invidunt ut labore et dolore magna aliquyam erat, sed diam
voluptua. At vero eos et accusam et justo duo dolores et ea
rebum. Stet clita kasd gubergren, no sea takimata sanctus est
Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet,
consetetur sadipscing elitr, sed diam nonumy eirmod tempor
invidunt ut labore et dolore magna aliquyam erat, sed diam
voluptua. At vero eos et accusam et justo duo dolores et ea
rebum. Stet clita kasd gubergren, no sea takimata sanctus est
Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet,
consetetur sadipscing elitr, sed diam nonumy eirmod tempor
invidunt ut labore et dolore magna aliquyam erat, sed diam
voluptua. At vero eos et accusam et justo duo dolores et ea
rebum. Stet clita kasd gubergren, no sea takimata sanctus est
Lorem ipsum dolor sit amet. gubergren, no sea takimata sanctus
est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet,
consetetur sadipscing elitr, sed diam nonumy eirmod tempor
invidunt ut labore et dolore magna aliquyam erat, sed diam
voluptua. At vero eos et accusam et justo duo dolores et ea
rebum. Stet clita kasd gubergren, no sea takimata sanctus est
Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet,
consetetur sadipscing elitr, sed diam nonumy eirmod tempor
invidunt ut labore et dolore magna aliquyam erat, sed diam
voluptua. At vero eos et accusam et justo duo dolores et ea
rebum. Stet clita kasd gubergren, no sea takimata sanctus est
Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet,
consetetur sadipscing elitr, sed diam nonumy eirmod tempor
invidunt ut labore et dolore magna aliquyam erat, sed diam
voluptua. At vero eos et accusam et justo duo dolores et ea
rebum. Stet clita kasd gubergren, no sea takimata sanctus est
Lorem ipsum dolor sit amet.
</Text>
</CustomScrollComponent>
</Animated.View>
</GestureDetector>
</View>
</GestureHandlerRootView>
);
}
In my rails 3.1 app I am working on a text email backup and want it to show up in the email client as text separated into new lines like this:
Lorem ipsum dolor sit amet
Consectetur adipisicing elit
Sed do eiusmod tempor incididunt
Ut labore et d Lorem ipsum dolor sit amet Consectetur adipisicing elit Sed do eiusmod tempor incididunt Ut labore et dolore magna aliquaolore magna aliqua
In my .text.haml file I have tried to use this:
:plain
Lorem ipsum dolor sit amet
Consectetur adipisicing elit
Sed do eiusmod tempor incididunt
Ut labore et dolore magna aliqua
However, when I check it in gmail it appears condensed into one paragraph like this:
Lorem ipsum dolor sit amet Consectetur adipisicing elit Sed do eiusmod tempor incididunt Ut labore et dolore magna aliqua
What can I do to get this to work? When I copy and paste this code into a view file, and view source, it appears as text as I want it in the view source, but gets condensed into one paragraph in the browser. Does this perhaps indicate that gmail is taking the text and formatting it that way and I don't actually have a problem?
I don't have a setup to test this, but I believe you want either :escaped or :preserve (probably the latter).
If those don't work, see http://haml.info/docs/yardoc/file.HAML_REFERENCE.html#filters for others (including info on how to create your own).
i load a local html file into an ipad application:
NSURL *baseURL = [NSURL fileURLWithPath:[[NSBundle mainBundle] bundlePath]];
NSString *path = [[NSBundle mainBundle] pathForResource:#"lieferant1" ofType:#"html"];
NSString *content = [NSString stringWithContentsOfFile:path encoding:NSUTF8StringEncoding error:nil];
[webView loadHTMLString:content baseURL:baseURL];
the webpage gets displayed, content of my html file:
<!DOCTYPE html>
<html>
<head>
<title></title>
</head>
<body>
<p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.</p>
<p>
<video>
<source src="banane.m4v">
</video>
</p>
so, banane.m4v is in my root, just in some groups, but not in real directories.
but the video section in my webview keeps black. no video gets loaded. i uploaded my html file and my .m4v video to my webserver to check if its not encoded properly, but everything works fine, surfing the html file with my ipad.
some ideas whats wrong?
oh my god
<video controls>
<source src="banane.m4v">
</video>
where controls is the magic word.
:X
I may be wrong (or silly) but, did you try file:///banane.m4v (Add the extra '/' for root)
For everyone that experiences a crossed out play symbol,
When you drag your movie-files (mp4's work as well, just make sure the codec is okay - easiest way is to export for iPhone with QuickTime) a dialog appears.
Make sure you tick your app under "add to targets".
Or if you already copied your video into the project, if you click it in Xcode's file browser, you'll have an option on the right-hand side to select targets.
You need to set the allowsInlineMediaPlayback property on the UIWebView:
[webView setAllowsInlineMediaPlayback:YES];
In html, you can do something like this
<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent eget
aliquet odio. Fusce id quam eu augue sollicitudin imperdiet eu ac eros.
<em>Etiam nec nisi lorem</em>, ac venenatis ipsum. In sollicitudin,
lectus eget varius tincidunt, felis sapien porta eros, non
pellentesque dui quam vitae tellus.
</p>
It is nice, because the paragraph of text still looks like a paragraph in the markup. In haml, it looks like this
%p
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent eget
aliquet odio. Fusce id quam eu augue sollicitudin imperdiet eu ac eros.
%em Etiam nec nisi lorem
, ac venenatis ipsum. In sollicitudin,
lectus eget varius tincidunt, felis sapien porta eros, non
pellentesque dui quam vitae tellus.
Is there any way to totally inline a tag in haml?
Haml excels for structural markup, but it's not really intended for inline markup. Read: Haml Sucks for Content. Just put your inline tags as HTML:
.content
%p
Lorem ipsum <em>dolor</em> sit amet.
Or else use a filter:
.content
:markdown
Lorem ipsum *dolor* sit amet.
I know this is old. But figured I'd post this in case anyone lands here. You can also do this sort of thing in haml (And maybe more what the OP was looking for?).
%p Here is some text I want to #{content_tag(:em, "emphasize!")}, and here the word #{content_tag(:strong, "BOLD")} is in bold. and #{link_to("click here", "url")} for a link.
Useful for those situations where doing it on multiple lines adds spaces you don't want
I.E. When you have a link at the end of a sentence, and don't want that stupid space between the link and the period. (or like in the OP's example, there would be a space between the and the comma.
Just don't get carried away like i did in the example :)
You can inline HTML in any HAML doing
%p!= "Lorem ipsum <em>dolor</em> sit amet"
The != operator means that whatever the right side returns it will be outputted.
As a hybrid of these nice answers by others, I think you can define a Helper method in your application_helper.rb for some inline markups you'd frequently use. You don't need to mix HTML with HAML, nor do you have to type much.
In your helper;
def em(text)
content_tag(:em, text)
end
#def em(text)
# "<em>#{text}</em>".html_safe
#end
In your haml;
%p
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent eget
aliquet odio. Fusce id quam eu augue sollicitudin imperdiet eu ac eros.
#{em 'Etiam nec nisi lorem'}, ac venenatis ipsum. In sollicitudin,
lectus eget varius tincidunt, felis sapien porta eros, non
pellentesque dui quam vitae tellus.
It's all about indentation:
%p
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent eget aliquet odio. Fusce id quam eu augue sollicitudin imperdiet eu ac eros.
%em
Etiam nec nisi lorem, ac venenatis ipsum. In sollicitudin, lectus eget varius tincidunt, felis sapien porta eros, non pellentesque dui quam vitae tellus.
I'm taking some user data and adding it to a PowerPoint presentation using VSTO. To get the formatting to look right, though I need to be able to set the left margin of some of the text in the textbox. There will be an initial block of text followed by another, indented block. For example (underlines added to emphasize spacing):
Lorem ipsum dolor sit amet,
consectetur adipiscing elit. Sed
vestibulum elementum neque id rhoncus.
In fermentum eros nec dolor lobortis
sit amet fermentum est consequat.
Curabitur eleifend nunc eu odio
vehicula ut elementum erat aliquam. Ut
adipiscing ipsum sit amet leo pulvinar
hendrerit. Cum sociis natoque
penatibus et magnis dis parturient
montes, nascetur ridiculus mus. Nulla
non neque in velit lacinia tempor et a
lacus.
___________Cras auctor bibendum urna, a facilisis lacus
lacinia non.
___________Nullam at quam a mauris consequat vulputate sed eu
sapien.
___________Fusce sed urna nulla, ut sagittis lacus. Pellentesque
tortor
___________augue, scelerisque at aliquet a, pretium ac
ipsum.
I can get this effect by setting Shape.TextFrame.TextRange.IndentLevel = 2 on the lower block of text. However, I cannot figure out how to programmatically set the value of the margin. Does anyone know how to do this?
This is taken care of via Shape.TextFrame.MarginRight and Shape.TextFrame.MarginLeft and the like.