WPF 에서 도형 은 문법 에 대한 상세 한 설명 을 나타 낸다(Path 의 Data 속성 문법)
21517 단어 Path
(그림 1)
부호 A
1
<
Page
xmlns
="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x
="http://schemas.microsoft.com/winfx/2006/xaml"
>
2
3
<
Canvas
>
4
5
6
7
<!--
PathFigureCollection
-->
8
9
<
Path
Stroke
="Black"
StrokeThickness
="1"
Fill
="#CCCCFF"
>
10
11
<
Path
.Data
>
12
13
<
PathGeometry
Figures
="M 10,100 C 10,300 300,-160 300,100"
/>
14
15
</
Path.Data
>
16
17
</
Path
>
18
19
20
21
<!--
StreamGeometry
-->
22
23
<
Path
Stroke
="Black"
Data
="M 100,240 C 510,300 80,100 300,160 H40 v80"
/>
24
25
</
Canvas
>
26
27
</
Page
>
28
29
위 에 굵 고 빨간색 문자 부분 을 유의 하 세 요.
WPF 는 경로 데 이 터 를 설명 하 는 두 가지 종 류 를 제공 합 니 다.하 나 는 StreamGeometry 이 고 다른 하 나 는 PathFigure Collection 입 니 다.
유사:
유사:
1
<
Path
Stroke
="Black"
StrokeThickness
="1"
Fill
="#CCCCFF"
>
2
3
<
Path
.Data
>
4
5
<
PathGeometry
Figures
="M 10,100 C 10,300 300,-160 300,100"
/>
6
7
</
Path.Data
>
8
9
</
Path
>
10
11
이런 방식 은 PathFigure Collection 의 XAML 코드 표시 방식 을 사용한다.
이 두 가지 방식 은 모두 같은 디 스 플레이 효과 에 도달 할 수 있다.그렇다면 언제 StreamGeometry 를 사용 하고 언제 PathFigure Collection 방식 을 사용 합 니까?
일반적으로 경 로 를 만 든 후에 수정 이 필요 하지 않 을 때 StreamGeometry 방식 을 사용 할 수 있 습 니 다.경로 수 치 를 수정 해 야 할 경우 PathFigure Collection 방식(여기 가 PathGeometry)을 사용 합 니 다.
Data 속성의 표현 문법:
(1)StreamGeometry 방식:[충전 규칙]외형 설명[외형 설명]*
(2)PathFigure Collection 방식:외형 설명[외형 설명]*
주:
(1)상기 문법 에서[...]는 선택 할 수 있 음 을 나타 내 고*는 임 의 개 를 나타 낸다.
(2)'충전 규칙'에는 Evenodd 와 Nonzero 두 가지 가 있다.XAML 에 서 는 간결 함 을 위해'F0'을 사용 하여 Evenodd 를 표시 하고'F1'은 Nonzero 를 표시 합 니 다.
(3)"외형 설명"의 문법:movecond drawCommands[closeCommand]
그 중:이동 명령(movecond),명령(drawCommands),명령 닫 기(closeCommand).
(4)movecond 는 시작 점 을 지정 합 니 다.drawingCommand 로 외형 윤곽 을 설명 하 는 내용 설명 을 사용 합 니 다.closeCommand 는 경 로 를 닫 습 니 다.
다음 그림:
(그림 2)
다음은'M 100,240 C510,300 80,100 300,160 H40 v80'이라는 문자열 의 의 미 를 설명 한다.
네 가지 상황 으로 나 누 어 설명 한다.
1.이동 명령:Move Command(M):M 시작 점 시작 점
예 를 들 어 M 100,240 또는 m 100,240
대문자 M 을 사용 할 때 절대 값 을 표시 합 니 다.소문 자 m 사용 시;앞의 값 에 비해 앞 점 이 지정 되 지 않 으 면 사용 합 니 다(0,0).
2.명령 을 그립 니 다(Draw Command):
우 리 는 다음 모양 을 그 릴 수 있다.
(1)직선:Line(L)
(2)수평 직선:수평선(H)
(3)수직 직선:수직 선(V)
(4)3 차 방정식 베 어 셀 곡선:Cubic Bezier curve(C)
(5)이차 방정식 베 어 셀 곡선:Quadratic Bezier curve(Q)
(6)부 드 러 운 3 차 방정식 베 어 셀 곡선:Smooth cubic Bezier curve(S)
(7)부 드 러 운 이차 방정식 베 세 르 곡선:부 드 러 운 quadratic Bezier 곡선(T)
(8)타원 원호:타원 아크(A)
위의 모든 모양 을 괄호 로 묶 은 영문 자 모 는 명령 약자 의 대문자 형식 이지 만 소문 자 를 사용 할 수도 있다.대문자 와 소문 자 를 사용 하 는 차 이 는 대문자 가 절대 치 이 고 소문 자 는 상대 값 이다.
예 를 들 어 L 100,200 L 300,400 은 절대 좌표 점(100,200)에서 다른 절대 좌표 점(300,400)까지 의 직선 을 나타 낸다.한편,l 100,200 l 300,400 은 상대 적 으로 위의 점(지정 되 지 않 으 면 기본 값(0,0)좌표 점)에서 계산 하기 시작 한 좌표 점(100,200)에서 좌표 점(300,400)까지 의 직선 을 나타 낸다.
우리 가 같은 유형 을 반복 해서 사용 할 때 앞의 명령 을 생략 할 수 있다.예 를 들 어 L 100,200 L 300,400 은 L 100,200 300,400 이 라 고 약칭 한다.
아래 그림 은 아래 XAML 코드 의 그리 기 효과 입 니 다.
XAML(코드 B):
(그림 3)
세심 한 독자 들 은 약간 이상 한 느낌 을 발견 할 수 있 습 니 다.왜냐하면 제 가 일부러 아래 삼각형 의 코드 를 앞 에 두 었 기 때 문 입 니 다.그러면 습관 에 맞지 않 는 것 같 습 니 다.사실 위의 코드 는 이 결과 와 완전히 같다.
여기에 당신 이 잠시 보지 못 한 Z 명령 이 있 습 니 다.그것 은 바로 닫 기 명령(close Command)입 니 다.지정 한 모양 을 닫 고 첫 번 째 끝 점 을 연결 하여 폐쇄 된 구역 을 만 들 겠 다 는 뜻 입 니 다.
명령 형식 문법 그리 기:
(1)직선:Line(L)
형식:L 끝 점 좌표 또는 l 끝 점 좌표.
예 를 들 어 L 100,100 또는 l 100.좌표 값 은 x,y(중간 에 영문 쉼표 로 구분)또는 x y(중간 에 반 각 빈 칸 으로 구분)형식 을 사용 할 수 있 습 니 다.
(2)수평 직선 Horizontal line(H):현재 점 에서 지정 한 x 좌표 까지 의 직선 을 그립 니 다.
형식:H x 값 또는 h x 값(x 는 System.Double 형식의 값)
예 를 들 어 H 100 또는 h 100 은 H 100.00 또는 h 100.00 등 형식 일 수도 있다.
(3)수직 직선 Vertical line(V):현재 점 에서 Y 좌 표를 지정 하 는 직선 을 그립 니 다.
형식:V y 값 또는 v y 값(y 는 System.Double 형식의 값)
예 를 들 어 V 100 또는 y 100 은 V 100.00 또는 v 100.00 등 형식 일 수도 있다.
(4)3 차 방정식 베 어 셀 곡선 Cubic Bezier curve(C):현재 점 에서 지정 한 끝 점 사이 의 3 차 방정식 베 어 셀 곡선 을 지정 합 니 다.
형식:C 제1 제어점 제2 제어점 끝 점 또는 c 제1 제어점 제2 제어점 끝 점
예 를 들 어 C 100,200 200,400 300,200 또는 c 100,200 200,400 300,200
그 중에서 점(100,200)은 첫 번 째 통제 점 이 고 점(200,400)은 두 번 째 통제 점 이 며 점(300,200)은 끝 점 이다.
(5)2 차 방정식 베 어 셀 곡선 Quadratic Bezier curve(Q):지정 한 제어점 을 통 해 현재 점 에서 지정 한 끝 점 사이 의 2 차 방정식 베 어 셀 곡선 을 그립 니 다.
형식:Q 제어점 끝 점 또는 q 제어점 끝 점
예컨대:q 100,200 300,200.그 중에서 점(100,200)은 제어점 이 고 점(300,200)은 끝 점 이다.
(6)부 드 러 운 3 차 방정식 베 어 셀 곡선:Smooth cubic Bezier curve(S):지정 한 점 을 통 해 현재 점 에서 지정 한 점 까지 의 베 어 셀 곡선 을 부 드 럽 게 제어 합 니 다.
형식:S 제어점 끝 점 또는 s 제어점 끝 점
예 를 들 면 S 100,200 200,300
(7)부 드 러 운 2 차 방정식 베 어 셀 곡선 smooth quadratic Bezier curve(T):부 드 러 운 3 차 방정식 베 어 셀 곡선 과 유사 합 니 다.
형식:T 제어점 끝 점 또는 t 제어점 끝 점
예 를 들 면 T 100,200 200,300
제(6)종 평활 3 차 방정식 베 세 르 곡선 과 제(7)종 평활 2 차 방정식 베 세 르 곡선 에 대한 비교:
다음 그림:
XAML 코드:
XAML 코드
1
<!--
-->
2
3
<
Path
Stroke
="Black"
StrokeThickness
="1"
Data
="M 150,10 S 250,100 80,280"
/>
4
5
6
7
<!--
-->
8
9
<
Path
Stroke
="Black"
StrokeThickness
="1"
Data
="M 150,10 L 250,100 80,280"
/>
10
11
12
13
<!--
-->
14
15
<
Path
Stroke
="Red"
StrokeThickness
="2"
StrokeDashArray
="1,1,1"
Data
="M 150,10 T 250,100 80,280"
/>
16
17
비고:편리 한 비 교 를 위해 저 는 같은 제어점 을 사 용 했 습 니 다.좌 표 는 모두:(250,100)이 고 시작 과 끝 점도 같 습 니 다.또한,나 는 점선(Stroke DashArray 속성 사용)과 서로 다른 색 으로 구분 했다.
(8)타원 원호:elliptical Arc(A):현재 점 과 지정 한 끝 점 사이 에 원 호 를 그립 니 다.
A 사이즈 원호 회전 각도 값 우위 호의 표지 양음 각도 표지 끝 점
또는:
a 사이즈 원호 회전 각도 값 우위 호의 표지 양음 각도 표지 끝 점
크기(Size):System.Windows.size 형식 으로 타원 원호 X,Y 방향의 반지름 값 을 지정 합 니 다.
회전 각도(rotationAngle):System.Double 형식 입 니 다.
원호 회전 각도 값(rotationAngle):타원 호의 회전 각도 값.
우세 호의 태그(is Large ArcFlag):우세 호 인지,호의 각도 가 180 도 이상 이면 1 로 설정 하고 그렇지 않 으 면 0 으로 설정 합 니 다.
양음 각도 표시(sweepDirectionFlag):정각 방향 으로 그 릴 때 1 로 설정 합 니 다.그렇지 않 으 면 0 입 니 다.
끝 점(endPoint):System.Windows.Point 형식 입 니 다.
3.닫 기 명령(close command):도형 의 첫 번 째,끝 점 을 직선 으로 연결 하여 폐쇄 된 구역 을 형성한다.
Z 또는 z 로 표시 하 다.
[원문 주소]http://blog.csdn.net/johnsuna/archive/2007/11/14/1885597.aspx
이 내용에 흥미가 있습니까?
현재 기사가 여러분의 문제를 해결하지 못하는 경우 AI 엔진은 머신러닝 분석(스마트 모델이 방금 만들어져 부정확한 경우가 있을 수 있음)을 통해 가장 유사한 기사를 추천합니다:
cocos2d Lua 학습(一)ios에서 루아 함수 호출 및 전참 방법 lua 코드: 출력 결과: lua 호출 C++ 방법: add 함수: lua 코드: 출력 결과: 함수를 호출합니다. 함수를 호출하려면 다음 협의를 따르십시오. 우선, 호출할 함...
텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
CC BY-SA 2.5, CC BY-SA 3.0 및 CC BY-SA 4.0에 따라 라이센스가 부여됩니다.
좋은 웹페이지 즐겨찾기
