마이크로 편지 애플릿 사용자 정의 제목 표시 줄

사용자 정의 제목 표시 줄을 설정할 수 있습니다 마이크로 채널 애플릿이 다른 페이지에 대해 개별적으로 설정할 수 있습니다
"사용자 정의": 페이지 파일 .json 파일 1. 다음 속성, 사용자 정의 탐색 표시 줄과 탐색 표시 줄 스타일 "navigationStyle"로 설정 "navigationBarTextStyle" "흰색"
　　특히 두 번째 캡슐 navigationBarTextStyle 스타일의 속성은 투명성을 조정할 수 있습니다

사용자 정의 레이아웃 스타일 탐색 로직 설정 2. 동적 효율성

3. 키 스트로크 (keystroke)! ! ! 탐색 바 상태 바 높이 네비게이션 바의 높이 + 호환이 세 가지 속성의 레이아웃을 알 필요가 높이 캡슐
　　여기 크기는 픽셀 단위를!
　　3.1 상태 바 높이
　　　　상태 항목은 휴대폰의 배터리 시간 영역 신호의 표시 정보를 말한다. 도 1을 참조하여 다음과 같다.

　　　　

　　시장에 전화 상태 표시 줄은 앞머리 특별한 모델과 다른 모델 앤드류스으로 높이, 전체 화면 아이폰 OS 화면의 다양한 사용합니다.
　　상태 막대의 높이를 얻는 방법 마이크로 채널 상태 바 높이 얻었다 wx.getSystemInfoSync () API를 호출

　　3.2 네비게이션 높이
　　　　캡슐의 영역과 기능 버튼을 디스플레이한다. 아래 그림을 참조하십시오

　　　　

　　　　높이를 얻기위한 네비게이션 방법이 고정 48px 아이폰 OS 40px 앤드류. 실제 시스템 환경에서 오류의 편집자 마진

　　3.3 캡슐 높이
　　　　다양한 모델의 테스트 결과에서이 32px 있습니다

　4. 스크롤 제목 표시 줄의 불투명도를 변경할 수있는 페이지
　　　현재 페이지 스크롤을 모니터링 onPageScroll 청취 이벤트 페이지를 권장합니다. 제목 표시 줄의 배경 불투명도 RGBA 설정
　　　이없는 모든 합리적인 사용의 사항 setData 스크롤 데이터 설정, 또는 페이지 Caton 및 기타 효과가 발생할 수 있음을 유의해야한다

: 테스트 모델
의 Andorid : 6 기장 기장 oppoR9s MIX3
아이폰 다음 X-7P XS XR을

관련 코드 :

  // 탐색 바의 높이를 설정 
  setNavigation을 () {
     // 시스템 정보 단위 PX의 위젯 
    SYSTEMINFO CONST = wx.getSystemInfoSync ()
     // 상태 바 높이 
    CONST가 = statusBarHeight systemInfo.statusBarHeight가
     // 아이폰 OS 실제 기계 높이 영역 (40)을 캡슐 
    송출 navigationHeight = 40 //는 앤드류 48 높이 영역 캡슐 IF (systemInfo.system.indexOf ( '안드로이드') == -1! ) { 
      navigationHeight = 48 
    } // 설정 이 본 .setData ({ 
      statusBarHeight : statusBarHeight, 
      navigationHeight : navigationHeight, 
      systemWidth을 : systemInfo.screenWidth 
    })
    
    
    
    
    // 캡슐, 높이 32px 오른쪽 상단 모서리. 일관된 각 장치 
  }
   // 모니터 페이지 스크롤링 
  onPageScroll : 함수 (E) {
     // 사항 setData에서만 소정 영역 
    IF (e.scrollTop < 이 본 .data.systemWidth) { 
      CONST 불투명도 = (e.scrollTop * 2) / 이 본 .data.systemWidth
       IF (불투명도> = 1이다. ) {
         IF ( 이 본 .data.statusBarOpacity == 1.! ) {
           이 본 .setData ({ 
            statusBarOpacity 불투명도 
          }) 
        } 
      } 다른 {
         이 본.setData ({ 
          statusBarOpacity : 불투명 
        }) 
      } 
    } 
  }