zoriya/react-native-svg
1
0
Fork 0
mirror of https://github.com/zoriya/react-native-svg.git synced 2025-12-21 06:15:15 +00:00
Code Issues Packages Projects Releases Wiki Activity

first step of TSpan

Browse Source
This commit is contained in:
Horcrux
2016-08-30 09:37:38 +08:00
parent e78e5db092
commit bd26c04a1d
10 changed files with 400 additions and 137 deletions
Download Patch File Download Diff File Expand all files Collapse all files

33
Example/examples/Text.js
View File

@@ -8,7 +8,8 @@ import Svg, {
Stop,
Defs,
Path,
G
G,
TSpan
} from 'react-native-svg';
class TextExample extends Component{
@@ -148,6 +149,33 @@ class TextPath extends Component{
}
}
class TSpanExample extends Component{
static title = 'TSpan nest';
render() {
return <Svg
height="150"
width="300"
>
<Text y="20" dx="5 5">
<TSpan x="10" textAnchor="middle">tspan line 1</TSpan>
<TSpan x="10" dy="15">tspan line 2</TSpan>
<TSpan x="10" dx="10" dy="15">tspan line 3</TSpan>
</Text>
<Text x="10" y="60" fill="red" fontSize="14">
<TSpan dy="5 10 20" >12345</TSpan>
<TSpan fill="blue" dy="15" dx="0 5 5">
<TSpan>6</TSpan>
<TSpan>7</TSpan>
</TSpan>
<TSpan dx="0 10 20" dy="0 20" fontWeight="bold" fontSize="12">89a</TSpan>
</Text>
<Text y="140" dx="0 5 5" dy="0 -5 -5">delta on text</Text>
</Svg>;
}
}
const icon = <Svg
height="20"
width="20"
@@ -168,7 +196,8 @@ const samples = [
TextRotate,
TextStroke,
TextFill,
TextPath
TextPath,
TSpanExample
];
export {