픽셀-비트 구현 앞으로 플래시를 PS에서 보다는 더 적은

작성자: jingjing 작은 화이트

웹을 처음으로 게임 UI, 우리가 발견 하는 시각적 규범의 개발 기본적으로 출력에 일반적인 편차 후. 아마 8630.html "> 때로는 몇 픽셀의 위치 오프셋은 대부분의 사용자에 대 한 우려 하지만 우리를 위해 그것은 매우 성가신 시각적 사양 디자이너의 자기 참조 보다는 실제 온라인 제품의 최종 결과의 데이터를 될 것입니다.

기본적으로 플래시 출력, 마지막에에서 PS 시작에서 우리의 디자인 프로세스 프런트 엔드 직접 추출 파일 정보 생산 온라인. 일반적인 감각으로 플래시 출력와 PS 효과 일관 된, 기본적인 온라인 컨트롤을 완벽 하 게 실현 될 수 있다.

PS와 플래시의 위치 확인에 초점.
위치를 플래시 게임 UI의 기본 원리:

여기 예를 들어 주요 인터페이스의 최근 게임, 우리의 게임 위치 관계의 설명. 프런트 엔드 프로그램 전체 주 인터페이스 (0, 0) 좌표는 왼쪽 위 모서리 정점입니다. 플래시의 상단 왼쪽된 좌표를 찾을 인터페이스 추출에서 직접.
즉, 핵심은 "정확한 (x, y) 좌표를 찾아."

떠 있는 레이어, 도구 설명 왼쪽된 상단 꼭지점 (0, 0) 좌표, 찾고 상대이 좌표 (x, y)에서 별도 구성 요소에 위치 하 고

또 다른: 플래시, 때문에 좌표는 소수점, 및 PS 픽셀 하지 않아도 소수점, 그래서 전체 수 있도록 데이터.

일반 설명선.

시각적인 원고 & http://www.aliyun.com/zixun/aggregation/37954.html "> nbsp; 표준 초안

위의 라벨, 플래시에 직접가 감소에 따라 다음과 같은 전위 문제가 있다:

레드 PS에 대 한 올바른 줄 간격, 1-3 픽셀의 편차에 비해 설정, 누적 편차는 큰, 전체 페이지 원.

1입니다. 플래시 텍스트 자료 위치:

플래시 오픈, 단락 입력 텍스트, 당신은 전체 텍스트 상자 플래시는 모든 방향으로 2 픽셀 확장 실제 시각적 글꼴 범위 보다는 더 많은 발견할 것 이다.

좌표 계산의 시작 지점 (X, y), 원래 좌표 된다의 좌표 (x-2, y-2).

2. PS 텍스트: PS14 번호 글꼴 예를 들어, 입력 후, 폰트 자체는 14PX, 13PX만. (그리고, 각 글꼴 크기-1의 실제 높이), 하단에 보이지 않는 픽셀의 빈 줄 때문에: 밑줄 위치를 가집니다.

결론: 때 인터페이스 플래시, 플래시, 가져오기 후 시각적 단어의 크기에에서 실제 크기는 왼쪽과 오른쪽으로 2 픽셀, 아래쪽 3 픽셀을 확장 하. Ps, 우리 현장 결과 x에서에서 단어의 위치를 측정 하는 경우 y 2 픽셀 마이너스 각 좌표, 올바른 입력된 플래시 좌표. 텍스트 상자와 텍스트 상자 사이의 간격을 발생 하면 PS 시각적 간격을 줄이기 위해 2 + 측정 2 + 1 = 5 픽셀 (보이지 않는 존재), 플래시 텍스트 상자와 텍스트 상자 간격 (2 픽셀 확장된 픽셀의 각 위아래로 플래시 텍스트 상자, 1 픽셀은 PS 텍스트 보이지 않는 밑줄 때문에)

3. 9 스도쿠/적응

해결된 2 소프트웨어 텍스트 차이 문제, 또한 모든 수를 대상. 이 때문에 지도의 하단에 인터페이스 요소 플래시 부품의 직접 생산의 일부는 비트맵입니다. 플래시 지도, 하단에 의해 만들어진의 구성 요소 중 하나는 각 파일 (0, 0) 시작 되도록 흩어져 해야 합니다 좌표는 실제로 해야 하는 위치에서 그렇지 않으면 전체 좌표 편차 표시 됩니다.

4. 버그

위의 결론을 확인 하는 때 우리 출력 파일 한 스크린샷 비교, 텍스트 상자 뿐 아니라 다른 픽셀의 가장자리는 약간 퍼지, 신중 하 게 그 1 픽셀 투명 가장자리 흐림, 찾을에 비해 발견을 확장 합니다. 이것은 날카로운 화면을 필요로 하는 인터페이스의 예상 하지입니다. 데이터 자체는 아무 문제, 자동 변 태 후 출력. 이것은 자연 및 인공 재해의 불가항력 적인 요인? 우리의 모든 좌표 없는 소수점 있다.

전임자의 친구, 그것은 이것이 플래시에서 버그, 모든 x, y 축 좌표는 원래 그림에 플러스 0.5 텍스트 상자 이외에 정수에 대 한 모든 긴 너비를 유지. 그래서, 결국 플래시 PS에서 달성 하기 위해 100% 완벽 한 구현 출력.

수정 하기 전에 수정

5. 프런트 엔드에서 몇 가지 의견

위의 섹션을 플래시 출력 교정 완료합니다. 그것은 프로그램을 직접 파일 및 데이터를 추출, 거기에 아무 문제가 될 것입니다 말했다 한다. 하지만, ued의 정신 유지 또는 프런트 엔드 하자 생성 된 일련의 테스트 파일 약 발생 하는 다양 한 그래픽 텍스트 9의 최종 테스트의 배열의 스도쿠. 나는 약간의 문제가 발견 했다.

인터레이스 텍스트에서 1PX 오류가 발생

이 때문에 PS에 줄 간격 4 픽셀, 하지만 마이너스 5, 플래시, 텍스트 차이 조정에 따라 줄 간격은 1 픽셀입니다. 그리고-1 행의 끝에, 라인을 누르면 기본 한 픽셀씩을 이동 합니다. 만약 그것은-2, 인터 레이스 2 픽셀 이동 합니다. 하지만 시각적 위치를 이동 하는 텍스트, 텍스트 상자 하지. 그래서 우리가 표시 하는 XY 축에 아무런 영향을 미치지가 있다. 그리고이 문제 발생 (만 선 거리 부정적 이다), 우리 그냥 처리 하 고, 프런트 엔드 수정 요구 사항을 조정 프런트 엔드 표시 해야.

요약

1. 주석은 단계 2의 결론에 따라 주석을 답니다.

2. 아래 그림은 AI 플래시 파일, 뿌리를 기억.

3. 텍스트 상자를 제외 하 고 모든 구성 요소 좌표 0.5가 됩니다.

4. 부정적인 라인과 앞에 있다.

PS 시각적 차원와 플래시 사이의 텍스트 쌍 수식:

추 신 (표시) 텍스트 아래로 2px + 3px 플래시 텍스트 계산 상자 =

예: PS 텍스트 (패널) 12 단어 15 라인 3 픽셀 선도 = = 플래시 1 줄 간격 (줄 간격에 대 한 플래시 패널:-1 점)

추 신: 단락 플래시 텍스트 상자에 해당:

작은 팁: ps 12 단어 12 간격 0 픽셀 간격 = = 플래시 최고의 포인트의 번호는 0 (하지만 실제 시각적 두 줄 밑줄된 위치 1PX 간격 표시)

위는 현재의 요약, 플래시 게임 그냥 연락처, 거기 충분 하지 않습니다, 전송 및 모두 함께 탐구 하 고 함께 진행.

파트너: Jingjing

출처: http://uedc.163.com/3023.html