Flex - 自動調整大小的數據網格的問題

我正在嘗試創建一個將垂直調整大小以確保所有呈現器都完整顯示的數據網格。此外，Flex - 自動調整大小的數據網格的問題

渲染器是可變的高度
渲染器可以調整自己

一般來說，事件的流程如下：

一個項目渲染器自身的大小（通常是響應用戶點擊等）
它調度父數據網格拾取的冒泡事件
DataGrid嘗試調整大小以確保所有渲染器保持全部可見。

我目前使用在DataGrid中此代碼來計算高度：

height = measureHeightOfItems(0, dataProvider.length) + headerHeight;

這似乎得到一個不正確的高度。我已經嘗試了一些變體，包括callLater（以確保調整大小已完成，因此度量可以正常工作），並重寫meausre（）並調用invalidateSize（）/ validateSize（），但都不起作用。

下面是3類將說明問題。單擊項目渲染器中的按鈕可調整渲染器的大小。網格也應該展開，以便全部顯示所有3個渲染器。

任何建議將不勝感激。

問候

瑪蒂

DataGridProblem.mxml（應用程序文件）

<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="vertical" 
    xmlns:view="view.*"> 
    <mx:ArrayCollection id="dataProvider"> 
     <mx:String>Item A</mx:String> 
     <mx:String>Item B</mx:String> 
     <mx:String>Item C</mx:String> 
    </mx:ArrayCollection> 
    <view:TestDataGrid 
     id="dg" 
     dataProvider="{ dataProvider }" 
     width="400"> 
     <view:columns> 
      <mx:DataGridColumn dataField="text" /> 
      <mx:DataGridColumn itemRenderer="view.RendererButton" /> 
     </view:columns> 
    </view:TestDataGrid> 
</mx:Application>

view.TestDataGrid.as

package view 
{ 
    import flash.events.Event; 

    import mx.controls.DataGrid; 
    import mx.core.ScrollPolicy; 

    public class TestDataGrid extends DataGrid 
    { 
     public function TestDataGrid() 
     { 
      this.verticalScrollPolicy = ScrollPolicy.OFF; 
      this.variableRowHeight = true; 
      this.addEventListener(RendererButton.RENDERER_RESIZE , onRendererResize); 
     } 
     private function onRendererResize(event : Event) : void 
     { 
      resizeDatagrid(); 
     } 
     private function resizeDatagrid():void 
     { 
      height = measureHeightOfItems(0, dataProvider.length) + headerHeight; 
     } 
    } 
}

view.RendererButton.mxml

<?xml version="1.0" encoding="utf-8"?> 
<mx:HBox xmlns:mx="http://www.adobe.com/2006/mxml"> 
    <mx:Button width="50" height="50" 
     click="onClick()" /> 

    <mx:Script> 
     <![CDATA[ 

      public static const RENDERER_RESIZE : String = "resizeRenderer"; 
      private function onClick() : void 
      { 
       this.height += 20; 
       dispatchEvent(new Event(RENDERER_RESIZE , true)); 
      } 
     ]]> 
    </mx:Script> 
</mx:HBox>

來源

2009-03-04 Marty Pitt

對於它的價值，我從來沒有設法解決這個問題。代碼很快就被處理邊緣案件所困擾。

我最終拋出了dataGrid方法，並使用VBox & HBox編寫了一個解決方案來方便調整大小。

來源

2009-03-18 09:11:36

......哦，有一種方法可以工作。 – DyreSchlock 2010-11-09 16:22:05

要做到的事情，如變量的寬度和高度細胞/行/列，以及其他「先進」的特點 - 嘗試擴大AdvancedDataGrid，而不是年紀大了，多沒意思DataGrid

來源

2009-03-04 10:18:55 adam

嗨在此siuation，使用AdvancedDataGrid不是一個選項。 Registers Marty – 2009-03-04 10:42:58

通過「無聊」，我想你的意思是「少車」。 – ggkmath 2013-06-08 14:36:32

爲什麼它的價值;你應該使用datagrid/advanced datagrid的variableRowHeight =「true」屬性。

如果它讓你感覺更好，我創建了自定義VBox，然後HBox解決方案發現它已經完成了！（snap !!）

祝你好運！

來源

2009-05-03 23:24:04

嗨Vusi 我已經嘗試使用variableRowWidth = true，但它沒有解決問題（因爲它似乎你現在面臨） – 2009-05-14 08:43:44

您的方法存在潛在的問題。 ItemRenderers旨在以一致的方式呈現數據項，並且如果您拋出當前渲染器並創建一個新渲染器並設置新渲染器的數據屬性，則它應該看起來與前一個渲染器完全相同。您不應該在數據成員之外對渲染器進行暫時更改，並且渲染器在您執行此操作時將採用奇怪的方式進行操作。

我懷疑如果您更改了數據模型對象以包含計數屬性，並且數據將渲染器的高度綁定到表達式「{50 + data.count * 20}」，然後使按鈕的單擊處理函數增加數據。按1計算，這會正常工作。（我的經驗是，只要數據屬性導致數據屬性完成更改，DataGrid就會重新繪製每行的適當大小，然後調用makeRowsAndColumns（）。）我還沒有爲您的示例嘗試過這種方法，所以我不能肯定地說它確實有效，但當然這是與物品渲染器一起工作的正確思維模式。

來源

2009-05-26 02:48:41

使用以下代碼可以使用AdvancedDataGrid實現此目標。如果刪除this.headerHeight，它也適用於List，這使我相信它應該適用於常規的舊DataGrid。

override protected function measure():void 
    { 
    super.measure(); 

    if (this.dataProvider) 
    { 
    var newHeight : int = measureHeightOfItems(0, this.dataProvider.length) + this.headerHeight; 

    this.minHeight = newHeight; 
    this.height = newHeight; 
    } 
    }

來源

2009-12-11 15:58:14 user229747

偉大的東西！這裏是一個更漂亮的版本：var newHeight：int = measureHeightOfItems（-1，dataProvider.length）;如果sparkRowHeight =「true」爲spark數據網格，則' – 2011-05-25 10:58:16

在運行時重新設置數據網格大小....使用rowcount屬性並將其與數據提供者長度綁定。隨着數據提供者被更新，所以將是行數。
你可以看到示例演示如何使用行數在柔性here

來源

2010-03-20 06:11:10

我有這樣的問題有點骯髒的解決方案試試這個

private function ResizeGrid():void{ 
    if (this.dg.maxVerticalScrollPosition > 0){ 
     this.dg.height +=5; 
     setTimeout(this.ResizeGrid,100); 
    } 
}

而且具有一定的延遲調用函數像如下

setTimeout(this.ResizeGrid,100);

這是骯髒的做法，但它適用於我:)

來源

2011-11-10 10:57:54 Zubair

下面的代碼在gridItemRenderer幫我：

protected function resize():void 
{ 
    column.grid.validateSize(); 
    column.grid.validateDisplayList(); 
}

來源

2012-02-24 07:35:38

我對這個問題的解決方案，呈現的變化需要與您的數據提供程序同步。然後只有measureHeightOfItems方法會給出準確的結果。

來源

2013-07-28 13:12:12 Raj

Flex - 自動調整大小的數據網格的問題

回答

相關問題