1

ページの下部にあるパネルがあります。下部のツールバーの中に、ツールチップを添付する必要があるこのボタンがあります。このボタンはページの下部にあり、その下にスペースがないため、ツールチップが表示されるたびに、ボタンの上に描画され、部分的にブロックされます。

この動作を回避するために、ボタンのすぐ上にツールチップを表示するようにしています。ドキュメントには、ツールチップのアンカープロパティをに設定するだけで簡単に実行できると記載されているため、最初はこれは単純に見えました'top'。

ただし、ボタンの上にマウスを置くと、ツールチップの現在のアンカー設定が考慮されていないようです。ツールチップはデフォルトの動作にフォールバックし、カーソルのすぐ右側に表示され続けます。

ホバリングするとき

私はここで何か間違ったことをしていますか？

これが私のコードの一部です：

Ext.define('Dashboard.view.companies.ListPanel', {
  extend: 'Ext.grid.Panel',

  // [snipped code]

  bbar: [{
      xtype: 'tbtext',
      text: 'Filtre actuel:'
    },{
      xtype: 'button',
      id: 'filter',
      text: 'Sociétés traitées',
      tooltip: {
        text: 'Enlever ce filtre',
        anchor: 'top'
      }
  }],

  // [snipped code]

});

に設定しようとしましたが、何も変わらなかったので、 constraintPositionはこの問題とは何の関係もないと思いますfalse。

アンカーをtopに設定するleftとright、効果がないようです。

ドキュメントのQuickTipsの例を調べましたが、そこでは正常に機能しているようです。私が見る唯一の違いは、例ではターゲットプロパティを明示的に設定しているのに対し、私の場合は、作成時にExt.button.Button＃setTooltip（）によって自動的に設定されることです。

最後に、mouseTrackをtrue効果なしに設定してみました。これは、何か怪しいことが起こっていることを示しているようです。

4

2 に答える 2

3

Geronimoの答えの後に私がそれを回避した方法は次のとおりです。

// works
listeners: {
  afterrender: function() {
    Ext.create('Ext.tip.ToolTip',{
      target: 'filter',
      html: 'Enlever ce filtre',
      anchor: 'top'
    });
  }
}

Ext.tip.Tooltipの代わりにこの方法を使用していることに注意してくださいExt.tip.QuickTip。以前は気がつきませんでしたが、QuickTips の例では、QuickTips の代わりに Tooltips が実際に使用されています。以前と同じ結果を得るためにこれを試したので、固定が正しく機能しない QuickTips のバグがあるようです。

// doesn't work as expected
listeners: {
  afterrender: function() {
    Ext.tip.QuickTipManager.register({
      target: 'filter',
      text: 'Enlever ce filtre',
      anchor: 'top'
    });
  }
}
于 2012-03-05T15:11:35.477 に答える
1

同じ問題に遭遇しました。なぜこのように設定されているのか、根本的な原因は何なのかわかりませんが、何らかの理由でExt.button.Buttonツールチップ構成を使用してもオプションが適切に適用されないことがわかりました。例が示すように私がそれをしたとき：ターゲット構成を持つ別のオブジェクトでツールチップ構成を定義し、それを使用Ext.create('Ext.tip.ToolTip', config)すると完全にうまくいきました。ボタンがすぐにレンダリングされないことに関係していると思います。

于 2012-03-02T17:00:42.213 に答える