防止鍵盤出現時用戶界面的移動

我正在使用Sencha Touch 2作爲用戶界面的小應用程序。現在，我在iPad和iPhone上的Safari中運行它。防止鍵盤出現時用戶界面的移動

我的問題是，無論何時點擊文本字段，Safari都會彈出虛擬鍵盤，並將整個Web視圖向上推出屏幕。

這看起來不太自然，因爲頂部工具欄不再可見。

下面是兩個屏幕截圖，演示了這個問題。在第二個屏幕截圖中，您可以看到鍵盤可見時的效果。

有沒有辦法來防止這種行爲，並讓Safari 調整用戶界面而不是？

來源

2012-05-16 BastiBen

你得到一個修復這個？ –

@AdilMalik：不，不幸的是沒有 – BastiBen

關於這個愚蠢的問題的任何更新？任何解決方案 –

-1

您將需要調用blur()方法上textfield

// Assuming the id of textfield - "textFieldId" 
Ext.getCmp('textFieldId').blur();

嘗試forcefully模糊該字段的輸入焦點。

來源

2012-05-16 14:44:19

這不是隱藏鍵盤，因爲文本字段失去了重點？重點是我實際上希望鍵盤在那裏，但沒有一半的用戶界面被推出屏幕。 – BastiBen

你想達到什麼目的？半鍵盤+休息一半你的應用程序...？ –

查看這兩個截圖。在較低的屏幕截圖中，您可以看到鍵盤推高了整個用戶界面。頂部的工具欄消失了。我想要顯示鍵盤而不用將UI推出屏幕頂部。相反，它應該調整大小。 – BastiBen

-2

如果您將html用於Sencha元素，必須刪除標籤html。或者你可以把標籤
放在源html代碼中。我希望能幫助你。 :)

來源

2012-05-16 21:34:46 hekomobile

對不起，我不確定你的意思。 – BastiBen

你能寫一些代碼嗎？我說錯誤在哪裏。謝謝 – hekomobile

不幸的是，蘋果希望這種行爲，但someone建議使用window.scrollTo（）有點黑客：

listeners: { 
    focus: function() { 
     window.scrollTo(0,0); 
    } 
}

來源

2012-07-23 06:39:49

感謝您的回答！它仍然不是完美的，因爲用戶可以看到後來被固定的初始移動。除此之外它工作正常。 –

我發現我工作的解決方案。將頂欄移動到容器中。

xtype: 'container', 
       docked: 'top', 
       height: '100%', 
       html: '', 
       itemId: 'MyContainer', 
       width: '100%', 
       items: [ 
        { 
         xtype: 'titlebar', 
         docked: 'top', 
         itemId: 'topBar', 
         title: 'Obec Webchat', 
         layout: { 
          type: 'hbox', 
          align: 'start' 
         }, 
         items: [ 
          { 
           xtype: 'button', 
           action: 'back', 
           id: 'BackButton', 
           itemId: 'BackButton', 
           margin: '5 70% 5 15', 
           ui: 'back', 
           text: 'Home' 
          } 
         ] 
        }, 
        { 
         xtype: 'container', 
         docked: 'bottom', 
         height: '95%', 
         html: '<iframe src="http://webim.obec.local/" width="100%" height="100%" scrolling="yes"></iframe>', 
         itemId: 'MyContainer1', 
         width: '100%' 
        } 
       ] 
      }

希望這會有所幫助。

來源

2014-05-05 10:13:19 SHEePYTaGGeRNeP

把這個代碼在發射功能在app.js爲我工作：

if (Ext.os.is.Android) { 
     Ext.Viewport.on('painted', function() { 
      Ext.Viewport.setHeight(window.innerHeight); 
     }); 
    } 

    if (Ext.os.is.iOS) { 

     Ext.Viewport.on('painted', function() { 
      Ext.Viewport.setHeight(window.innerHeight); 
     }); 
    }

來源

2015-12-02 06:28:53 Murtuza

防止鍵盤出現時用戶界面的移動

回答

相關問題