by aligning the columns of the datagrid programmatically

I have a datagrid that I add 2 columns of conditionally during execution. How can I get the 2 columns that I added to align to the right?

I tried textAlign = right but that did not turn

Thank you! Who did the trick. Looking in my code, I see that I actually did this before but had completely forgotten about this

Tags: Flex

Similar Questions

  • Bad alignment of the column header separator and separator columns in mx:DataGrid.

    Hi all

    I use a mx:DataGrid control in my project of extension for InDesign CS5/CS55.5/CS6. I personalized the style attributes of the DataGrid control to change its appearance as shown in the following image.

    SampleDataGrid.png

    Question: As we see in the picture that after changing this style attribute separator column header is not aligned with separator of columns of the DataGrid body (more clearly shown in the zoomed image).

    MisalignedSeparator.png

    I also found that if I remove the "headerColors" property then it seems (maybe because of camouflage of the dividing line white with the default color of the header, as shown in the image below).

    DefaultHeader.png

    Any suggestion/solution to correct this lack of alignment.

    Notice that I must use this dark color appearance. I used FlashBuilder4.6, ExtensionBuilder2.1, ExtensionBuilder 3.4 SDK on Mac OS X 10.7.5.

    Here is the source code,

    DataGridExtension.mxml

    <? XML version = "1.0" encoding = "utf-8"? >

    "" < mx:Application xmlns:mx = "http://www.adobe.com/2006/mxml" layout ="absolute" historyManagementEnabled = "false"applicationComplete = "colorSync ()" creationComplete = "creationCompleteHandler (event)"> "

    < mx:Script >

    <! [CDATA]

    Import mx.collections.ArrayCollection;

    Import mx.events.FlexEvent;

    [Bindable]

    private var itemsObject:ArrayCollection = new ArrayCollection();

    public function colorSync():void{}

    AutoTheme.sync ();

    }

    protected function creationCompleteHandler(event:FlexEvent):void

    {

    itemsObject.addItem ({'page':'Page 01' 'status':"ready",'observation':'high quality'});

    itemsObject.addItem ({'page':' Page 02' 'status':'Waiting','observation':'low quality''});

    itemsObject.addItem ({'page':'Page 03' 'status':"ready",'observation':'high quality'});

    itemsObject.addItem ({'page':'Page 04' 'status':"ready",'observation':'high quality'});

    itemsObject.addItem ({'page':'Page 05' 'status':'Waiting','observation':'low quality'});

    itemsObject.addItem ({'page':'Page 06' 'status':"ready",'observation':'high quality'});

    itemsObject.addItem ({'page':'Page 07' 'status':"ready",'observation':'high quality'});

    }

    []] >

    < / mx:Script >

    < mx:Style >

          MX | DataGrid { }

    headerColors: #333333, #333333

    alternatingItemColors: #222222 #252525

    textRollOverColor: #FFFFFF

    textSelectedColor: #FFFFFF

    color: #CDCDCD;

    borderStyle: solid;

    rollOverColor: #333333

    selectionColor: #444444

    -color of the border: #222222

    textSelectedColor: #ffffff

    dropShadowEnabled: fake

            cornerRadius: 4

    }

    < / mx:Style >

    "" < mx:VBox height = "100%" width ="100%" verticalAlign = "middle" horizontalAlign ="center">

    " < mx:Spacer height ="10"width ="100%"/ >

    "" " < mx:DataGrid id ="pageDataGrid"dataProvider =" itemsObject{}"verticalAlign ="middle"width ="100%"buttonMode ="true"height ="100%">

    < mx:columns >

    "" < mx:DataGridColumn dataField = "page" headerText ="Page" width = "50"/ > "

    "" < mx:DataGridColumn dataField = "status" headerText ="status" width = "50"/ > "

    "" < mx:DataGridColumn dataField = "Note" headerText ="Note" width = "100"/ > "

    < / mx:columns >

    < / mx:DataGrid >

    < / mx:VBox >

    < / mx:Application >

    OK, the header separator is 2 pixels wide and that's why he is not in line with the separation of body that is only 1 pixel wide.

    Thank you. I solved the problem by adding a 'programming skin' based on 'mx.skins.halo.DataGridHeaderSeparator' that I defined for 'headerSeparatorSkin' mx:DataGrid property.

    I also tried adding a 'graph skin' by using a PNG image with a width of line 1 file x 22 pixels. This fixed the misalignment, but another problem because of which the last separator becomes 2 pixel wide while all others were 1 pixel wide.

    Here I post my code snippets for others,

    1. Add a new MyDataGridHeaderSeparator.mxml file for programmatic skin as follows (for example in the View.skin package).

    MyDataGridHeaderSeparator.mxml

    http://www.Adobe.com/2006/mxml '.

    xmlns:haloSkins = "" MX.skins.Halo. * ">"

    /**

    * Replaced it draw the line splitter in the DataGrid header columns. Since the default

    * implementation was originally 2 numbers when headerColors style in the DataGrid property changes

    * to match with the theme of dark color of the overall expansion,

    * 1. Misalignment of the separator in the header with the separation of body.

    * 2. Draw lines of separation of 2 pixels with the first in color light gray and others in dark grey.

    **/

    override protected function updateDisplayList(unscaledWidth:Number,_unscaledHeight:Number):void {}

    The line width value 1 pixel to draw lines 1 pixel wide divider.

    graphics.lineStyle (1, 0 x 000000);

    Go from x = 0 to x = 1 to solve the problem of misalignment.

    graphics.moveTo (1, 0);

    Draw the line of separation of (1,0) (1, unscaledHeight).

    graphics.lineTo (1, unscaledHeight);

    }

    ]]>

    And then simply set the property 'headerSeparatorSkin' of mx:DataGrid to this skin, for example inline definition property as below,

    hand. MXML

  • How to align the dialog box in the center of a popup programmatically

    Hey,.

    I use jdeveloper 11g release 2.

    Can someone help on how to align the dialog box programmatically a popup?

    Kind regards

    Steve

    Hello

    As far as I know, if we do not have indications of the dialog then displays on the center of the screen by default.

    This will solve your problem?

    Gud luck!

    HA

  • Cannot set the DataGrid column width

    I am very frustrated with the DataGrid control and I don't understand why it won't work. I followed the tutorial "Build year Application In An Hour" by Adobe and finally managed to extract data from a database in a DataGrid control, the data very well, but all the columns are the same width and will not change when creating. Of course I can drag the column widths when the DataGrid control has made, but you shouldn't do that. The columns are not enough even wide to fit in the title of each column. The tutorial mentioned resizing of columns, but does not specify how. I've manually entered in the < S:GridColumn > tags and entered like width = "800" see no change. I changed the width of the data grid itself, I even tried setting the width to 100%. I also went in the "Configure columns" dialog, and then in advanced and set a minWidth, but it still doesn't work, I even disabled 'resize' and still nothing. I also tried different combinations of the aforementioned attempts.

    How can it be difficult to set the width of a column?

    I should also mention that I use Adobe Flex Builder 4.5 for PHP.

    Well, I solved the problem and I'm very embarrassed to say that it is my browser cache. It was not show my saved new, which is a bit worrying plans sometimes that I need to change the small values and run my application every 10 seconds to see the update.

  • Help with the creation of the Datagrid column

    I am trying to get a better understanding of the way the Spark DataGrid works so that I can create and version extended for one of my projects. One of the things that really left me speechless is how the datagrid sets up the columns based on the dataprovider when no explicit column is defined. I was able to debug through the initialization of the datagrid to the point where the setter for dataprovider is called. At this point, my debug trace goes "down the rabbit hole" so to speak and when she returns, the columns are initialized but I can't figure out how. Could someone tell me please to the class or function that is actually responsible for creating the columns of the dataprovider if they are not defined explicitly?

    So, as you have discovered, the Grid method / generateColumns (private) is called if the list of columns is always set to null when the commitPropertes().   Subsequently becomes the columns property, as a consequence of the liaison, should update the list of columns as expected.

    Could create an example that illustrates the problem you meet?   I'd be happy to look at it.

    -Hans

  • Adding dynamic columns to datagrid at the beginning of the datagrid

    Hello friends,

    There is a datagrid that is static. and I m adding a dynamic column. It is added at the end of the static data grid

    but I want to add dynamic at the begning of the datagrid column can someone help me on this.

    Thanking you,

    Kind regards

    Gallot

    datagridfeeamount.dataProvider = new ArrayCollection (event.result.rows.row) collection;

    the word 'new', after that the = was supposed to be red and larger

  • Presentation of the bulletin, by aligning the columns, paragraph breaks, and lines of text

    Hello

    I've never drawn a newsletter before.

    It's annoying me because I try to be as meticulous as possible with my alignment, but I noticed there are all things that don't align.

    I have a paragraph style, with a space before and after. I have three columns. When I look at a line of text across all columns of three, they are not aligned. May they line up if I had all the text directly and no image wraps, but the envelopes of the image and the beginning of a new paragraph in column 2, throws the alignment in column 3.

    What is the best way to align things with the least possible effort?

    Are there tutorials on good bulletin of the layout-design? Presentation of the grid?

    Thank you

    Stanlayout.jpg

    Learn about the starting grids.

    Bob

  • Change the first column seen in the datagrid by code?

    Hello

    Is anyway to change the first column in a DataGrid using action script? I mean, for example, think I have 10 columns, only 3 are seen (0,1,2). I just want to have a button to change the first column view. Thus, for example, if I press it, 1.2, and third column will be those that is displayed in the datagrid control. I need to emulate the same thing that the scroll bar when you drag in a datagrid, but instead of letting the scroll bar does that automatically, I want to "scroll" datagrid manually.

    Moreover, is anyway through datagrid children and hide the scrollbar manually?

    Thanks in advance,

    Aron.

    horizontalScrollPolicy

  • Column of the datagrid to access from another column

    Hello

    Basically, I have 2 columns in a DataGrid, both with the checkbox itemRenderers.

    When I check the first box, I want the second either activated = false.  I'm stuck.

    Thank you!

    Normally, you need work on the data provider, because the converters element are recycled, and you get strange results if you do not work on the DP.

  • How can we change an image programmatically in the DataGrid cell

    I have a DataGrid that contains a status icon. I was able to get the initial to display in the DataGrid control status icon. But I'm unable to update the computer. Basically, I need to update the image of a selected line with a "assets/processing.png", ' assets/success.png' or ' assets/failure.png' image. I can't seem to be able to find a way to access the image in the cell need to update/replace it. I tried to give him a property from my collection ArrayCollection data provider, but it does not work. I also tried some how to get a reference to the original image, so it can be replaced, but can not understand how to do such. Here is the code for my DataGrid. I'll be very grateful for any help in this. (I'm relatively new on Flex/ActionScript, but a developer experienced otherwise).

    <mx:DataGrid id="myDataGrid" left="0" top="0" bottom="0" right="0"
                         allowMultipleSelection="true" verticalScrollPolicy="on"
                         draggableColumns="false" resizableColumns="false" sortableColumns="false"
                         dataProvider="{myArrayCollection}">
                <mx:columns>
                    <mx:DataGridColumn headerText="Name" dataField="name" wordWrap="true" />
                    <mx:DataGridColumn headerText="Status" dataField="status" width="75" textAlign="center">
                        <mx:itemRenderer>
                            <mx:Component id="statusComponent">
                                <mx:HBox id="imageBox" width="100%" height="100%" horizontalAlign="center">
                                    <mx:Image id="statusImage" source="@Embed('assets/pending.png')" width="16" height="16"  />
                                </mx:HBox>
                            </mx:Component>
                        </mx:itemRenderer>
                    </mx:DataGridColumn>
                </mx:columns>
            </mx:DataGrid>
    

    The image must be a property of the arrayCollection collection.  You can either save the image url as a property of type string, or if you must nest, then you can create an actionscript for each image object in a script (private var image1:Image = Image(); image1.source=@embed...)

    Then, in the code that processes the event that causes the image must change, replace the image property of the collection arrayCollection member (s) concerned. Then, at the end of the code for the event, trigger the DataGrid to update using the method myDataGrid.invalidateList ();

    Mark

  • Align the text of the varchar2 column data

    Hello

    It is in reference below thread:
    Re: Align the text of varchar2

    I think I should post my question in this forum, rather than General database,

    I created a table and inserted the same that in the thread that above, and when I said:
    Select ID, FILLED_TEXT(DESCRIPTION,30) FROM T;

    It does not show the data in the column as aligned in 30 word boundaries. I thought, that I would be able to resolve the issue with the help of the http://soft.buaa.edu.cn/oracle/bookshelf/Oreilly/prog2/ch11_02.htm link, but failed.

    Kindly help me more.

    Kind regards.

    Okay, so you're saying there is already a tags in the code to indicate where the line breaks are necessary, so a small adjustment of the data to include these tags and also the code...

    DROP TABLE test_data
    /
    CREATE TABLE test_data as
    select 1 as id, q'[For several days after leaving Nantucket, nothing above hatches was seen of Captain Ahab. The mates regularly relieved each other at the watches, and for aught that could be seen to the contrary, they seemed to be the only commanders of the ship; only they sometimes issued from the cabin with orders so sudden and peremptory, that after all it was plain they but commanded vicariously.<>Yes, their supreme lord and dictator was there, though hitherto unseen by any eyes not permitted to penetrate into the now sacred retreat of the cabin.]' as txt from dual union all
    select 2, q'[Every time I ascended to the deck from my watches below, I instantly gazed aft to mark if any strange face were visible; for my first vague disquietude touching the unknown captain, now in the seclusion of the sea, became almost a perturbation. This was strangely heightened at times by the ragged Elijah's diabolical incoherences uninvitedly recurring to me, with a subtle energy I could not have before conceived of. But poorly could I withstand them, much as in other moods I was almost ready to smile at the solemn whimsicalities of that outlandish prophet of the wharves.<> But whatever it was of apprehensiveness or uneasiness - to call it so - which I felt, yet whenever I came to look about me in the ship, it seemed against all warrantry to cherish such emotions. For though the harpooneers, with the great body of the crew, were a far more barbaric, heathenish, and motley set than any of the tame merchant-ship companies which my previous experiences had made me acquainted with, still I ascribed this - and rightly ascribed it - to the fierce uniqueness of the very nature of that wild Scandinavian vocation in which I had so abandonedly embarked. But it was especially the aspect of the three chief officers of the ship, the mates, which was most forcibly calculated to allay these colorless misgivings, and induce confidence and cheerfulness in every presentment of the voyage. Three better, more likely sea-officers and men, each in his own different way, could not readily be found, and they were every one of them Americans; a Nantucketer, a Vineyarder, a Cape man. Now, it being Christmas when the ship shot from out her harbor, for a space we had biting Polar weather, though all the time running away from it to the southward; and by every degree and minute of latitude which we sailed, gradually leaving that merciless winter, and all its intolerable weather behind us. It was one of those less lowering, but still grey and gloomy enough mornings of the transition, when with a fair wind the ship was rushing through the water with a vindictive sort of leaping and melancholy rapidity, that as I mounted to the deck at the call of the forenoon watch, so soon as I levelled my glance towards the taffrail, foreboding shivers ran over me. Reality outran apprehension; Captain Ahab stood upon his quarter-deck. End]' from dual
    /
    
    CREATE OR REPLACE FUNCTION wordwrap (p_txt IN VARCHAR2, p_linesize IN NUMBER) RETURN t_wordwrap_txt PIPELINED IS
      cursor cur_wordwrap(p_txt in varchar2) is
        select rn, txt
        from (
              select rownum as rn
                    ,trim(regexp_substr(p_txt,'.{1,'||p_linesize||'}( |$)',1,rownum)) as txt
              from dual
              connect by rownum <= ceil(length(p_txt)/p_linesize)+10
             )
        where txt is not null
        order by rn;
      v_txt varchar2(4000);
      v_length number := 0;
      v_paratxt varchar2(4000) := p_txt;
      v_paratxt_part varchar2(4000);
      v_pos number;
      v_srch varchar2(100) := '<>';
    begin
      loop
        exit when v_paratxt is null;
        v_pos := instr(v_paratxt,v_srch);
        v_paratxt_part := case when v_pos = 0 then v_paratxt else substr(v_paratxt,1,v_pos-1) end;
        v_paratxt := case when v_pos = 0 then null else trim(substr(v_paratxt,v_pos+length(v_srch))) end;
        for w in cur_wordwrap(v_paratxt_part)
        loop
          v_txt := w.txt;
          loop
            exit when length(v_txt) = p_linesize or instr(v_txt,' ') = 0;
            for i in 1..p_linesize-length(v_txt)
            loop
              v_txt := regexp_replace(v_txt,'([^ ]) ','\1  ',1,i);
            end loop;
          end loop;
          v_length := v_length + length(v_txt);
          if length(v_txt) > 0 then
            pipe row(v_txt);
          end if;
        end loop;
        if v_paratxt is not null then
          pipe row(''); -- new line before next part
        end if;
      end loop;
      return;
    end;
    /
    

    results...

    SQL> select test_data.id, x.column_value
      2  from test_data, table(wordwrap(test_data.txt,50)) x
      3  /
    
            ID COLUMN_VALUE
    ---------- ---------------------------------------------------
             1 For  several days after leaving Nantucket, nothing
             1 above  hatches was seen of Captain Ahab. The mates
             1 regularly  relieved each other at the watches, and
             1 for aught that could be seen to the contrary, they
             1 seemed to be the only commanders of the ship; only
             1 they  sometimes  issued from the cabin with orders
             1 so  sudden  and  peremptory, that after all it was
             1 plain     they    but    commanded    vicariously.
             1
             1 Yes,  their  supreme  lord and dictator was there,
             1 though  hitherto  unseen by any eyes not permitted
             1 to  penetrate  into  the now sacred retreat of the
             1 cabin.
             2 Every  time I ascended to the deck from my watches
             2 below,  I  instantly  gazed  aft  to  mark  if any
             2 strange  face  were  visible;  for  my first vague
             2 disquietude  touching  the unknown captain, now in
             2 the   seclusion   of  the  sea,  became  almost  a
             2 perturbation.  This  was  strangely  heightened at
             2 times    by   the   ragged   Elijah's   diabolical
             2 incoherences  uninvitedly  recurring to me, with a
             2 subtle  energy  I  could not have before conceived
             2 of.  But poorly could I withstand them, much as in
             2 other  moods  I  was  almost ready to smile at the
             2 solemn  whimsicalities  of that outlandish prophet
             2 of                   the                  wharves.
             2
             2 But   whatever   it  was  of  apprehensiveness  or
             2 uneasiness  -  to  call  it so - which I felt, yet
             2 whenever  I  came to look about me in the ship, it
             2 seemed  against  all  warrantry  to  cherish  such
             2 emotions.  For  though  the  harpooneers, with the
             2 great  body of the crew, were a far more barbaric,
             2 heathenish,  and  motley  set than any of the tame
             2 merchant-ship    companies   which   my   previous
             2 experiences  had  made me acquainted with, still I
             2 ascribed  this  - and rightly ascribed it - to the
             2 fierce  uniqueness of the very nature of that wild
             2 Scandinavian   vocation   in   which   I   had  so
             2 abandonedly  embarked.  But  it was especially the
             2 aspect  of  the  three chief officers of the ship,
             2 the  mates,  which was most forcibly calculated to
             2 allay   these  colorless  misgivings,  and  induce
             2 confidence  and  cheerfulness in every presentment
             2 of   the   voyage.   Three   better,  more  likely
             2 sea-officers  and  men,  each in his own different
             2 way,  could  not  readily  be found, and they were
             2 every  one  of  them  Americans;  a Nantucketer, a
             2 Vineyarder,  a  Cape  man. Now, it being Christmas
             2 when  the  ship  shot  from  out her harbor, for a
             2 space  we had biting Polar weather, though all the
             2 time running away from it to the southward; and by
             2 every  degree  and  minute  of  latitude  which we
             2 sailed,  gradually  leaving that merciless winter,
             2 and  all its intolerable weather behind us. It was
             2 one  of  those  less  lowering, but still grey and
             2 gloomy  enough  mornings  of  the transition, when
             2 with  a fair wind the ship was rushing through the
             2 water  with  a  vindictive  sort  of  leaping  and
             2 melancholy rapidity, that as I mounted to the deck
             2 at  the  call  of the forenoon watch, so soon as I
             2 levelled   my   glance   towards   the   taffrail,
             2 foreboding  shivers  ran  over  me. Reality outran
             2 apprehension;   Captain   Ahab   stood   upon  his
             2 quarter-deck.                                  End
    
    65 rows selected.
    
    SQL>
    
  • How to dynamically add a column to the DataGrid

    Hey there everyone. Forgive me, I'm very new to this.
    I use a data grid to display values analyzed in an xml file.
    The application needs of 5 columns, no problem, however, if a value is present in the xml file, I need to add another column.
    If I have a var defined as
    var gps_present which is a string, and if the value == 'Yes' adds a column in my datagrid?

    < mx:DataGrid id = "summary_grid" x = "10" y = "15" width = "500" height = "434".
    dataProvider = "{summary.lastResult.phones.phone}" >
    < mx:columns >
    < mx:DataGridColumn headerText = "phone number" dataField = "phone number" width = "3" / >
    < mx:DataGridColumn headerText = "inc_java" dataField = "inc_java" width = "3" / >
    < mx:DataGridColumn headerText = "inc_sms" dataField = "inc_sms" width = "3" / >
    a logic here if inc_gps == 'y '.
    < mx:DataGridColumn headerText = "inc_gps" dataField = "gps" width = "3" / >
    < / mx:columns >
    < / mx:DataGrid >


    Thank you for any advice on that.

    nephish,

    Yes. Sorry, displaying large blocks of code on the forums is a little tricky. Posted an example here: http://blog.flexexamples.com/2008/03/04/dynamically-adding-new-columns-to-a-datagrid-contr ol in flex /

    Hope that helps,
    Peter

  • Problem of masking and the columns in a datagrid

    Hello

    I noticed that the order in which the values are displayed gets reversed when I hide or show the column in the datagrid control. The robot to hide is triggered when the in button header that is rendered using headerRenderer.The see the feature is triggered when the value in the drop-down list with the name of the appropriate column is selected. If there is no solution to this help me. I tried various possilibilities, but none worked. I develop applications on Flex Builder 3.

    Thank you and best regards,
    Amar.

    Hello

    I thought that this issue was raised in reason to use itemRenderer for individual DatagridColumns. This has been fixed as soon as I use itemRenderer for the entire Datagrid rather than the individual columns.
    Thank you
    Amar

  • Align the column heading in the table of the ADF in the Center

    Hello
    I'm trying to align the column heading in the table of the ADF in the centre, but not able to find any property of the table, I also tried using inline CSS but not able to achieve any success.
    Can someone help me make.

    Hello

    Try:

    
      
        
           
             
           
        
      
      
    
    

    -Anton

  • How to set the DataGrid header to center text?

    Hi all

    When the textAlign property value Center it's the alignment of the header text and the column to Center

    Is there a headerText to Center alignment and columns text align left.

    Thanks in advance

    KKC


    It does not work, and you don't need to implement a custom for this itemRenderer:


    DataGrid

    {
    headerStyleName:dataGridHeaderStyle;
    }

    .dataGridHeaderStyle

    {
    fontWeight: bold;
    textAlign:right;
    }
       

Maybe you are looking for