DataGridの列内のラベルにTruncateToFitを使用すると問題が発生する

Question

flexでdataGridを使用してこの問題が発生しています。私は、DataGridの列の1つにLabelを持っていて、ラベルにはtruncateToFitプロパティTrueがあります。 しかし、それは動作していません。

最初はLabelに静的な幅がありましたが、その場合は動作します。しかし、その問題を使用して、私は、出力の列の幅を変更するとき、それはラベルの幅を変更しないと、私は列の幅を小さくする場合は、ラベルは切り捨てられません。

ラベルに100％の幅を使用すると、どちらも役に立ちません。

<mx:AdvancedDataGrid id="user_files_list" width="100%" height="100%" 
        top="0" left="0" dragEnabled="true" dragMoveEnabled="true" 
        dataProvider="{fm_model.user_files_list}" 
        allowMultipleSelection="true" borderStyle="solid" rowHeight="45"> 
        <mx:columns>    
        <mx:DataGridColumn id="col2" sortable="true" headerText="Type" width="120" 
          headerStyleName="datagridHeader" dataField="content_type"> 
          <mx:itemRenderer> 
           <mx:Component> 
            <mx:Canvas width="100%" height="100%" verticalScrollPolicy="off" borderThickness="2" borderStyle="solid" horizontalScrollPolicy="off"> 
              <mx:Label width="100%" text="{'tag' == data.content_type?'File Folder': 
              outerDocument.getText(data.name)}" truncateToFit="true" styleName="labelStyle" 
              verticalCenter="0" /> 
            </mx:Canvas>           
           </mx:Component> 
          </mx:itemRenderer> 
         </mx:DataGridColumn> 

よろしく Zeeshan

Answer 1

[OK]を..私はこれが動作しない理由はわからないだけでなく... Adob​​eのドキュメントは言う「これを：

マイデータグリッドコードは、下記のコードのようになります。プロパティはデータバインディングのソースとして使用できますが、col2.widthへの直接のバインディングは機能しませんでした。http://help.adobe.com/en_US/FlashPlatform/reference/actionscript/3/mx/controls/advancedDataGridClasses/AdvancedDataGridColumn.html#width

....しかし、列の幅にバインドするだけで済みます。 Bindingsは正しく更新されていないようです...代わりに、私は入力フレームハンドラを使用して、ラベルの幅がバインドされているパブリック変数を更新しています。これは回避策ですが、幅を確実に更新します。

は、このことができますなら、私に教えてください...歓声

<?xml version="1.0" encoding="utf-8"?> 
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" minWidth="955" minHeight="600" 
       enterFrame="application1_enterFrameHandler(event)"> 
    <mx:Script> 
     <![CDATA[ 

      [Bindable] 
      public var colWidth:Number; 

      protected function application1_enterFrameHandler(event:Event):void 
      { 
       colWidth = col2.width; 
      } 

     ]]> 
    </mx:Script> 
    <mx:AdvancedDataGrid id="user_files_list" width="100%" height="100%" 
         top="0" left="0" dragEnabled="true" dragMoveEnabled="true" 
         dataProvider="{[{content_type:'sad asde asd asd asdasd.l;k;asd ;lsd asd;alsd;asd asdasd asdkasd' + 
          'asdad asdasd asdasd asdasdasdasdasd asdasd asda sdasda sdasd aa sdasd asdasdasd asd asdasd' + 
          'asdd asdasd asda sda sda sdasdasda d asd a sd a sd a sd a sdasdasd a sdasdasd asdasdasd as' + 
          'jkhkhkjhkjh Gold Diamond, Gold Chain!'},{content_type:'Hello\''}, {content_type:'World'}]}" 
         allowMultipleSelection="true" borderStyle="solid" rowHeight="45"> 
     <mx:columns>    

      <mx:AdvancedDataGridColumn id="col2" sortable="true" headerText="Type" width="120" 
           headerStyleName="datagridHeader" dataField="content_type"> 
       <mx:itemRenderer> 

        <mx:Component> 
         <mx:Canvas width="100%" height="100%" verticalScrollPolicy="off" borderThickness="2" borderStyle="solid" horizontalScrollPolicy="off"> 
          <mx:Label width="{mx.core.Application.application.colWidth}" 
            text="{data.content_type}" truncateToFit="true" styleName="labelStyle" 
             verticalCenter="0" /> 
         </mx:Canvas>           

        </mx:Component> 

       </mx:itemRenderer> 

      </mx:AdvancedDataGridColumn> 
      <mx:AdvancedDataGridColumn width="200"/> 
     </mx:columns> 

    </mx:AdvancedDataGrid> 
</mx:Application> 

Answer 2

あなたは、静的な幅を維持し、AdvancedDataGridタグの属性variableRowHeight=trueとwordWrap=trueを設定することができます。この作品が欲しい！幅を指定する

Answer 3

エレガントな方法は

theText.width = AdvancedDataGrid(handle.owner).columns[handle.columnIndex].width; 

ここ

var handle:AdvancedDataGridListData = AdvancedDataGridListData(listData); 

なりそうアイテムレンダラーではなく、ハードコードで特定の列に結び付けるの、再利用することができます。

Answer 4

ラベルにminWidth="1"を設定し、width="100%"と設定することで、動作させることができました。

minWidthがラベルの全長に設定されていたため、親のサイズを正しく調整できませんでした。

注：自分のスタイルを維持するために、textAlign="left"も設定しなければならなかった。これはあなたのケースでは当てはまらないかもしれない。