2013-12-11 31 views
0

我想在我的應用程序中實現一個基本的後退按鈕。後退按鈕不能在BB10 QML文件

我在頁面中使用web視圖。

添加了一個按鈕和我從論壇中找到的代碼。

Button { 
     id: button1 
     text: "Back" 
     onClicked: { 
      WebView.goBack(); 
     } 

我錯過了什麼?

+0

該按鈕如何找到ID爲'WebView'的對象?當你運行這個時,設備日誌會顯示任何東西 - 比如'WebView not found'? –

回答

0

這是簡單的代碼

main.qml

import bb.cascades 1.0 
NavigationPane { 
    id: nav 
    Page { 
     id: pg 
     titleBar: TitleBar { 
      id: tb 
      title: "Mini Web Browser" 


     } 

     Container {layout:StackLayout { 
       orientation:LayoutOrientation.TopToBottom 
     } 
     Container { 

      layout:StackLayout { 
       orientation:LayoutOrientation.LeftToRight 
      } 
      TextField { 
       id:tf 
       hintText: "Enter you Url" 
       inputMode: TextFieldInputMode.Url 
       input.submitKey: SubmitKey.Go 

       layoutProperties: StackLayoutProperties { 
        spaceQuota: 5 
       } 

      } 
      Button { 
       id:go 
       imageSource: "asset:///ic_done.png" 
       layoutProperties: StackLayoutProperties { 
        spaceQuota: 1 
       } 
       onClicked: { 
        console.log(tf.text); 
        console.log(myWebView.urlChanged(tf.text)) 

       } 
      } 


     } 
     ScrollView { 
      scrollViewProperties.pinchToZoomEnabled: true 
      scrollViewProperties.scrollMode: ScrollMode.Both 
      WebView { 
       id:myWebView 
       url: "https://www.google.com/search?q="+tf.text 
       settings.devicePixelRatio: 1.0 

       onLoadingChanged: { 
        if (loadRequest.status == WebLoadStatus.Started) { 
         statusLabel.setText("Loading start..................") 
         tb.title=myWebView.title 
         statusLabel.visible=true 

        } 
        else if (loadRequest.status == WebLoadStatus.Succeeded) { 
         statusLabel.setText("Loading finished.") 
         statusLabel.visible=false 
         tb.title=myWebView.title         
        } 
        else if (loadRequest.status == WebLoadStatus.Failed) { 
         statusLabel.setText("Load failed.") 
        } 
       } 
      } 
     } 
     ProgressIndicator { 
      id: pi 
      verticalAlignment: VerticalAlignment.Fill      
      fromValue:0 
      toValue: 100 
      value:myWebView.loadProgress 
      onValueChanged: { 
       if(value<100) 
        pi.visible=true 
       else if(value== 100) 
        pi.visible=false 


      } 
     } 

     Label{ 
      id: statusLabel 
      verticalAlignment: VerticalAlignment.Bottom 
      horizontalAlignment: HorizontalAlignment.Fill 
      text: "ram"  
      //visible: 
      textStyle.textAlign: TextAlign.Left 
      textStyle.color: Color.Black 
     } 

     } 


     actions:[ 
      ActionItem { 

       enabled: myWebView.canGoBack 
       title: "Back" 
       ActionBar.placement: ActionBarPlacement.OnBar 
       imageSource: "asset:///ic_previous.png" 

       onTriggered: { 
        myWebView.goBack() 

       } 

      }, 

      ActionItem { 
       title: "Forword" 
       enabled: myWebView.canGoForward 
       ActionBar.placement: ActionBarPlacement.OnBar 
       imageSource: "asset:///ic_next.png" 
       onTriggered: { myWebView.goForward(); 

       } 

      }, 

      ActionItem { 
       title:myWebView.loading ? "Stop" : "Reload" 

       ActionBar.placement: ActionBarPlacement.OnBar 
       imageSource:myWebView.loading ? "asset:///ic_cancel.png" : "asset:///ic_rotate.png" 
       onTriggered: {myWebView.loading ? myWebView.stop():myWebView.reload(); 

       } 

      } 
     ] 
    } 
} 
0

這是我用它獲取加載從那些可能包含鏈接到應用程序網站,瞭解更多的資產目錄HTML幫助頁面信息。彼得的評論可能是你的解決方案。在這種情況下,後退按鈕放置在標題欄中,但它可以很容易地放置在操作欄,溢出菜單或其他位置。

import bb.cascades 1.0 

Page { 
    titleBar: TitleBar { 
     title: "Help" 
     scrollBehavior: TitleBarScrollBehavior.NonSticky 
     dismissAction: ActionItem { 
      title: "Close" 
      onTriggered: { 
       helpSheet.close(); 
      } 
      imageSource: "asset:///images/ic_cancel.png" 
     } 
     acceptAction: ActionItem { 
      title: "Back" 
      enabled: webView.canGoBack 
      onTriggered: { 
       webView.goBack(); 
      } 
     } 
    } 

    id: helpPage 
    objectName: "helpSheet" 
    ScrollView { 
     Container { 
      layout: StackLayout { 
      } 
      WebView { 
       id: webView 
       url: "local:///assets/help.html" 
       layoutProperties: StackLayoutProperties { 
      } 
      topMargin: 21.0 
      } 
     } 
    } 
}