페이지의 flex와div 마스크 효과 및 입력법 문제

Flex가 HTML에 포커스를 삽입하여 중국어와 DIV 문제를 숨길 수 없음
분류: Flex4 2011-07-05 20:067명 리뷰(0) 즐겨찾기 제보
기본적으로 Flash가 웹 페이지에 포함된 경우 SWF 파일은 모든 HTML 요소의 최상위 렌더링 레벨에 기본적으로 배치됩니다.모든 html 요소와 유사한 총부 용기 상층은 어떤 html 요소에도 가려지지 않습니다.
플래시 용기와 층의 깊이(z-index)를 아무리 설정해도 소용없다.
이 문제에 부딪히면 flash에 삽입된embed나object 탭에'wmode'속성을 추가하고wmode='transparent'또는'opaque'를 설정하면 Flex4에서 기본 HTML 용기를 포위하는 방식이 코드와 같이 바뀝니다.
view plain
       
          var swfVersionStr = "10.0.0"; 
          var xiSwfUrlStr = "playerProductInstall.swf"; 
          var flashvars = {}; 
          var params = {}; 
          params.quality = "high"; 
          params.bgcolor = "#ebf4ff"; 
          params.allowscriptaccess = "sameDomain"; 
          params.allowfullscreen = "true"; 
          var attributes = {}; 
          attributes.id = "BSC_ABIS_App"; 
          attributes.name = "BSC_ABIS_App"; 
          attributes.align = "middle"; 
          swfobject.embedSWF( 
              "BSC_ABIS_App.swf", "flashContent",  
              "100%", "100%",  
              swfVersionStr, xiSwfUrlStr,  
              flashvars, params, attributes); 
swfobject.createCSS("#flashContent", "display:block;text-align:left;"); 
       
이거는 저희가 위에 있는 Params에 넣을 수 있어요.
view plain
params.wmode = "opaque";혹은
params.wmode = "transparent"; 
기타 상황은 기본적으로 같다
그런 다음 다음과 같은 속성을 살펴보겠습니다.
window 모드
기본적으로 디스플레이 모드입니다. 이런 모드에서 플래시 플레이어는 자신의 창 핸들을 가지고 있습니다. 이것은 플래시 영화가 Windows에 존재하는 실례이고 브라우저의 핵심 디스플레이 창 위에 있기 때문에 플래시는 브라우저에 나타나는 것 같지만 이것은 플래시가 가장 빠르고 효율적인 렌더링 모드입니다.브라우저와 독립적인 HTML 렌더링 표면이기 때문에, 기본 디스플레이 방식에서 플래시는 항상 위치와 일치하는 모든 DHTML 층을 가립니다.
그러나 대부분의 애플 컴퓨터 브라우저는 DHTML층이 플래시 위에 나타나는 것을 허용하지만 플래시 영화가 재생될 때 비교적 이상한 현상이 나타난다. 예를 들어 DHTML층이 플래시에 긁힌 것처럼 이상하게 나타난다.
Opaque 모드
이것은 창이 없는 모드입니다. 이 경우 플래시플레이어는 자신의 창 핸들이 없습니다. 이것은 브라우저가 플래시플레이어에게 브라우저의 렌더링 표면에 그려진 시간과 위치를 알려야 합니다.이때 플래시 필름은 브라우저 HTML 렌더링 표면보다 높지 않고 다른 요소와 같은 페이지에 있기 때문에 z-index 값을 사용하여 DHTML 요소가 플래시를 가리거나 가려지는 것을 제어할 수 있다.
Transparent 모드
투명 모드, 이런 모드에서 플래시 플레이어는 스테이지의 배경색 알파 값을 0으로 하고 스테이지에서 실제로 볼 수 있는 대상만 그릴 수 있다. 마찬가지로 z-index를 사용하여 플래시 영화의 깊이 값을 제어할 수 있지만 Opaque 모드와 달리 이렇게 하면 플래시 영화의 재생 효과를 낮출 수 있다. 또한 9.0.115 이전의 플래시 플레이어 버전에서 wmode="opaque"또는 "transparent"를 설정하면 전체 화면 모드가 효력을 상실할 수 있다.
이 속성들을 다 보았을 때, 우리는 문득 해결할 수 있다는 것을 깨달았다.그러나 문제는 Flash에 초점을 맞춘 후에 HTML 요소인 HTML과 같은 INPUT 입력 상자로 전환하는 것을 발견했다. 아무리 입력법을 바꾸어도 중국어가 나오지 않는다는 것이다.서두르지 마세요. 사실 이것은 Flash의 BUG라고 할 수 있지만 저희도 해결할 방법이 있어요.
내가 API 구석에 숨겨진 함수를 힘껏 뒤적였을 때 나는 웃었다.yd가 웃었어.
이 협객이 바로 플래시입니다.system.Capabilities.
우리는 단지 그것의 속성 중 하나를 사용하면 시스템의 입력법인 Capabilities를 볼 수 있다.hasIME: [읽기만 가능] 시스템에서 입력기 편집기(IME)가 설치되어 있는지 여부를 지정합니다. 이 경우 true이고 그렇지 않으면 false입니다.서버 문자열은 IME입니다.
Flash에 초점을 맞출 때 IME.enabled 속성은 Flash 비활성화 값에 의해 False로 변경됩니다. 이것은 HTML 요소에 초점을 맞추고 입력법이 쓸모가 없는 이유입니다.원인을 찾았으니그럼 저희가 해결을 해보도록 하겠습니다.
먼저 Flash 마스터에 대한 이벤트 수신 사용 MouseEvent.ROLL_OUT:
InteractiveObject 인스턴스에서 포인터 장치를 이동할 때 할당됩니다.이벤트 대상은 포인터 장치 아래에 있던 객체 또는 객체의 상위 수준입니다.relatedObject는 포인터 장치를 이동하는 객체입니다.이 대상의 부모 체인 이상에서 rollOut 이벤트를 연속으로 분배하고 이 대상을 시작으로 relatedObject의 뿌리나 시조를 제외한 최고 단계의 부모로 끝냅니다.
rollOut 이벤트의 목적은 하위 레벨이 있는 디스플레이 대상 용기의 이동 행위를 인코딩하는 것을 간소화하는 것입니다.마우스가 객체 표시 영역 또는 하위 영역에서 벗어나 하위 수준 이외의 객체로 이동하면 객체 할당 rollOut 이벤트가 표시됩니다.이것은 마우스가 표시된 대상 용기의 하위 대상 영역을 벗어날 때마다 마우스가 분리되기 때문에 마우스가 표시된 대상 용기의 다른 하위 대상에 남아 있어도 마우스가 분리되는 것과 다른 행위입니다.
Flash에서 커서를 떼면 입력기를 수동으로 설정합니다. 코드는 다음과 같습니다.
view plain
appGroup.addEventListener(MouseEvent.ROLL_OUT, setSRF); 
/** 
* 커서가 Flash를 벗어나면 시스템 설정 입력기가 켜집니다.
             * */ 
            private function setSRF(event:MouseEvent):void{ 
                if(Capabilities.hasIME){ 
                    IME.enabled=true; 
                    IME.conversionMode="CHINESE"; 
                } 
            } 
OK. 페이지 실행에 성공했습니다.디브이도 올라왔어.중국어 입력법도 쓸 수 있게 되었다.기뻐서 환호해라.
보충: 오늘 저녁 프로젝트가 시작되었을 때 비극을 발견했습니다. 어떤 컴퓨터에서 방문했을 때 2063 오류를 보고했습니다. IME 이상!신이시여, 살려주세요!!!한 무리의 사람들이 내가 이 버그를 조정하기를 기다리고 있는데, 오리와 배가 어떻게 큰 글자가 되겠는가!구글의 앞 3페이지를 펼쳤는데, 풀이가 없습니다!신은 나를 구하지 않을 것이다. 1시간여의 실험을 거쳐 마침내 이 문제를 해결했다.
    

 private function setSRF(event:MouseEvent):void{
				if(Capabilities.hasIME){
		         try{
						if(!IME.enabled){
							IME.enabled=true;
						}
						
						IME.conversionMode="CHINESE";
					}catch(e:Error){
					
					}
					
				}
			}
        

단지 하나의 판단을 추가했고trycatch 블록을 추가했습니다. OK, 완벽하게 해결했습니다. 프로젝트가 출시되었습니다!