5 Replies Latest reply on Dec 10, 2008 4:37 AM by niksk

    Partial visible data

    niksk
      Hello Everyone

      I am working on flex application. In that I have one datagrid. In that "Location" column I am showing the current folder name as data and tool tip of that is the complete path of that folder.

      But now I want to show the complete URI of that location as data but in this form ".../location". So that when I stretch out the column the complete path will show on the column.

      So please help me out around this as I am not able to find any topic related to this.

      Thanks
        • 1. Re: Partial visible data
          niksk Level 1
          Plese give some suggestion.
          • 2. Re: Partial visible data
            atta707 Level 2
            Essentially, you'll be playing with TextLineMetrics class.

            Add a label to disable it's truncateToFit property and start listening for resize event. The width would in percentage and you'll need to specify minWidth so that it resizes down as well as up when the container is resized:

            <mx:Label id="label1" text="C:\Program Files\Adobe\Flex Builder\Framework\bin"
            resize="resizeHandler(event)" truncateToFit="false"
            minWidth="50"
            width="100%"/>

            Now in your resizeHandler method just get a reference of TextLineMetrics by calling the measureText() method on your label. Run your program in debug mode (F11) and watch the trace while you resize the window:

            private function resizeHandler(event:ResizeEvent) : void {
            var tlm:TextLineMetrics = label1.measureText(label1.text);
            trace("label width: " + label1.width + ", text width: " + tlm.width)
            }


            Now use some simple match to decide number of characters that can fit into the available width of the label.

            Turn that Label into a itemRenderer and set it as a renderer for your column in he grid.

            ATTA
            • 3. Re: Partial visible data
              niksk Level 1
              Hey Atta

              Thanks for your reply.

              Actually I have some columns in my datagrid is like....
              <mx:columns>
              <mx:AdvancedDataGridColumn headerText="" id="chkBox" width="30" itemRenderer="com.basepin.view.TeamMember.PunchlistTab.PunchlistTabNavigator.CenteredChec kBox" sortable="false" />
              <mx:AdvancedDataGridColumn headerText="Actions" itemRenderer="com.basepin.view.TeamMember.PunchlistTab.GridRowActionButtonsHBox" width="200" minWidth="100" sortable="false"/>
              <mx:AdvancedDataGridColumn headerText="Closeout Item" id="closeoutItem" width="370" itemRenderer="com.basepin.view.TeamMember.PunchlistTab.PunchlistTabNavigator.PunchItemRen derer" editable="false" sortCompareFunction="sByCloseoutItem" />
              <mx:AdvancedDataGridColumn headerText="Description" dataField="description" width="600" editable="true" sortable="false" >
              <mx:itemRenderer>com.basepin.view.TeamMember.PunchlistTab.PunchlistTabNavigator.Descripti onTextArea</mx:itemRenderer>
              </mx:AdvancedDataGridColumn>
              <mx:AdvancedDataGridColumn headerText="Tasks" id="tasks" width="1200" itemRenderer="com.basepin.view.TeamMember.PunchlistTab.PunchlistTabNavigator.PunchItemTas ksVBox" sortable="false"/>
              <mx:AdvancedDataGridColumn headerText="Locations" width="225" itemRenderer="com.basepin.view.TeamMember.PunchlistTab.PunchlistTabNavigator.PunchItemLoc ationsVBox" sortable="false"/>
              </mx:columns>



              and I am using the ItemRenderer for my LOCATION column is like


              <?xml version="1.0" encoding="utf-8"?>
              <mx:VBox
              xmlns:mx=" http://www.adobe.com/2006/mxml"
              width="100%"
              height="100%"
              creationPolicy="all"
              verticalGap="0"
              paddingLeft="5"
              paddingRight="5"
              paddingTop="3"
              paddingBottom="3"
              verticalAlign="middle"
              >
              <mx:Script>
              <![CDATA[
              import mx.controls.Label;
              import mx.core.*;

              override public function set data( value:Object ):void
              {
              super.data = value;
              this.removeAllChildren();

              if ( super.data == null ) return;

              for each ( var closeout_item_location:XML in data.closeout_item_locations.closeout_item_location )
              {
              var sTagId:String = closeout_item_location.tag_id;
              var sName:String = closeout_item_location.tag_name;
              var sURI:String = closeout_item_location.uri;
              var lbl:Label = new Label();
              lbl.text = sName;
              lbl.toolTip = sURI;
              lbl.selectable = true;
              this.addChild( lbl );
              }
              }


              ]]>
              </mx:Script>
              </mx:VBox>

              So here I want to show the label as full URI but in ".../location" form and when I stretch the column from mouse It should show the ".../location/location", I mean URI from rightside.......

              • 4. Re: Partial visible data
                niksk Level 1
                Need Some Help.......
                • 5. Re: Partial visible data
                  niksk Level 1
                  I need help around it, I am not able to find any way around it.