<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>Flex Examples &#187; dropdownWidth</title>
	<atom:link href="http://blog.flexexamples.com/tag/dropdownwidth/feed/" rel="self" type="application/rss+xml" />
	<link>http://blog.flexexamples.com</link>
	<description>Just a bunch of Adobe Flex Examples</description>
	<lastBuildDate>Wed, 26 Jan 2011 18:09:51 +0000</lastBuildDate>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
			<item>
		<title>Setting the width of the dropdown menu on a ComboBox control in Flex</title>
		<link>http://blog.flexexamples.com/2008/07/02/setting-the-width-of-the-dropdown-menu-on-a-combobox-control-in-flex/</link>
		<comments>http://blog.flexexamples.com/2008/07/02/setting-the-width-of-the-dropdown-menu-on-a-combobox-control-in-flex/#comments</comments>
		<pubDate>Thu, 03 Jul 2008 06:51:38 +0000</pubDate>
		<dc:creator>Peter deHaan</dc:creator>
				<category><![CDATA[ComboBox]]></category>
		<category><![CDATA[dropdownWidth]]></category>

		<guid isPermaLink="false">http://blog.flexexamples.com/2008/07/02/setting-the-width-of-the-dropdown-menu-on-a-combobox-control-in-flex/</guid>
		<description><![CDATA[<p>The following example shows how you can set the width of the dropdown menu on a Flex ComboBox control by setting the dropdownWidth property.</p> <p>Full code after the jump.</p> <p></p> &#60;?xml version=&#34;1.0&#34; encoding=&#34;utf-8&#34;?&#62; &#60;!-- http://blog.flexexamples.com/2008/07/02/setting-the-width-of-the-dropdown-menu-on-a-combobox-control-in-flex/ --&#62; &#60;mx:Application xmlns:mx=&#34;http://www.adobe.com/2006/mxml&#34; layout=&#34;vertical&#34; verticalAlign=&#34;top&#34; backgroundColor=&#34;white&#34;&#62; &#160; &#60;mx:Array id=&#34;arr&#34;&#62; &#60;mx:Object label=&#34;One&#34; /&#62; &#60;mx:Object label=&#34;Two&#34; /&#62; &#60;mx:Object label=&#34;Three&#34; /&#62; &#60;mx:Object label=&#34;Four&#34; [...]]]></description>
			<content:encoded><![CDATA[<p>The following example shows how you can set the width of the dropdown menu on a Flex ComboBox control by setting the <code>dropdownWidth</code> property.</p>
<p>Full code after the jump.</p>
<p><span id="more-693"></span></p>

<div class="wp_syntax"><div class="code"><pre class="mxml" style="font-family:monospace;"><span style="color: #000000;">&lt;?xml version=<span style="color: #ff0000;">&quot;1.0&quot;</span> encoding=<span style="color: #ff0000;">&quot;utf-8&quot;</span>?<span style="color: #7400FF;">&gt;</span></span>
<span style="color: #000000;"><span style="color: #808080; font-style: italic;">&lt;!-- http://blog.flexexamples.com/2008/07/02/setting-the-width-of-the-dropdown-menu-on-a-combobox-control-in-flex/ --&gt;</span></span>
<span style="color: #000000;"><span style="color: #7400FF;">&lt;mx:Application</span> xmlns:mx=<span style="color: #ff0000;">&quot;http://www.adobe.com/2006/mxml&quot;</span></span>
<span style="color: #000000;">        layout=<span style="color: #ff0000;">&quot;vertical&quot;</span></span>
<span style="color: #000000;">        verticalAlign=<span style="color: #ff0000;">&quot;top&quot;</span></span>
<span style="color: #000000;">        backgroundColor=<span style="color: #ff0000;">&quot;white&quot;</span><span style="color: #7400FF;">&gt;</span></span>
&nbsp;
    <span style="color: #000000;"><span style="color: #7400FF;">&lt;mx:Array</span> id=<span style="color: #ff0000;">&quot;arr&quot;</span><span style="color: #7400FF;">&gt;</span></span>
        <span style="color: #000000;"><span style="color: #7400FF;">&lt;mx:Object</span> label=<span style="color: #ff0000;">&quot;One&quot;</span> <span style="color: #7400FF;">/&gt;</span></span>
        <span style="color: #000000;"><span style="color: #7400FF;">&lt;mx:Object</span> label=<span style="color: #ff0000;">&quot;Two&quot;</span> <span style="color: #7400FF;">/&gt;</span></span>
        <span style="color: #000000;"><span style="color: #7400FF;">&lt;mx:Object</span> label=<span style="color: #ff0000;">&quot;Three&quot;</span> <span style="color: #7400FF;">/&gt;</span></span>
        <span style="color: #000000;"><span style="color: #7400FF;">&lt;mx:Object</span> label=<span style="color: #ff0000;">&quot;Four&quot;</span> <span style="color: #7400FF;">/&gt;</span></span>
        <span style="color: #000000;"><span style="color: #7400FF;">&lt;mx:Object</span> label=<span style="color: #ff0000;">&quot;Five&quot;</span> <span style="color: #7400FF;">/&gt;</span></span>
        <span style="color: #000000;"><span style="color: #7400FF;">&lt;mx:Object</span> label=<span style="color: #ff0000;">&quot;Six&quot;</span> <span style="color: #7400FF;">/&gt;</span></span>
        <span style="color: #000000;"><span style="color: #7400FF;">&lt;mx:Object</span> label=<span style="color: #ff0000;">&quot;Seven&quot;</span> <span style="color: #7400FF;">/&gt;</span></span>
        <span style="color: #000000;"><span style="color: #7400FF;">&lt;mx:Object</span> label=<span style="color: #ff0000;">&quot;Eight&quot;</span> <span style="color: #7400FF;">/&gt;</span></span>
        <span style="color: #000000;"><span style="color: #7400FF;">&lt;mx:Object</span> label=<span style="color: #ff0000;">&quot;Nine&quot;</span> <span style="color: #7400FF;">/&gt;</span></span>
        <span style="color: #000000;"><span style="color: #7400FF;">&lt;mx:Object</span> label=<span style="color: #ff0000;">&quot;Ten&quot;</span> <span style="color: #7400FF;">/&gt;</span></span>
    <span style="color: #000000;"><span style="color: #7400FF;">&lt;/mx:Array</span><span style="color: #7400FF;">&gt;</span></span>
&nbsp;
    <span style="color: #000000;"><span style="color: #7400FF;">&lt;mx:ComboBox</span> id=<span style="color: #ff0000;">&quot;comboBox&quot;</span></span>
<span style="color: #000000;">            dataProvider=<span style="color: #ff0000;">&quot;{arr}&quot;</span></span>
<span style="color: #000000;">            dropdownWidth=<span style="color: #ff0000;">&quot;200&quot;</span> <span style="color: #7400FF;">/&gt;</span></span>
&nbsp;
<span style="color: #000000;"><span style="color: #7400FF;">&lt;/mx:Application</span><span style="color: #7400FF;">&gt;</span></span></pre></div></div>

<p class="information"><a href="http://blog.flexexamples.com/wp-content/uploads/ComboBox_dropdownWidth_test/bin/srcview/index.html">View source</a> is enabled in the following example.</p>
<p><iframe src="http://blog.flexexamples.com/wp-content/uploads/ComboBox_dropdownWidth_test/bin/main.html" width="100%" height="200"></iframe></p>
<p>Due to popular demand, here is the &#8220;same&#8221; example in a more ActionScript friendly format:</p>

<div class="wp_syntax"><div class="code"><pre class="mxml" style="font-family:monospace;"><span style="color: #000000;">&lt;?xml version=<span style="color: #ff0000;">&quot;1.0&quot;</span> encoding=<span style="color: #ff0000;">&quot;utf-8&quot;</span>?<span style="color: #7400FF;">&gt;</span></span>
<span style="color: #000000;"><span style="color: #808080; font-style: italic;">&lt;!-- http://blog.flexexamples.com/2008/07/02/setting-the-width-of-the-dropdown-menu-on-a-combobox-control-in-flex/ --&gt;</span></span>
<span style="color: #000000;"><span style="color: #7400FF;">&lt;mx:Application</span> xmlns:mx=<span style="color: #ff0000;">&quot;http://www.adobe.com/2006/mxml&quot;</span></span>
<span style="color: #000000;">        layout=<span style="color: #ff0000;">&quot;vertical&quot;</span></span>
<span style="color: #000000;">        verticalAlign=<span style="color: #ff0000;">&quot;top&quot;</span></span>
<span style="color: #000000;">        backgroundColor=<span style="color: #ff0000;">&quot;white&quot;</span></span>
<span style="color: #000000;">        initialize=<span style="color: #ff0000;">&quot;init();&quot;</span><span style="color: #7400FF;">&gt;</span></span>
&nbsp;
    <span style="color: #339933;">&lt;mx:Script&gt;</span>
<span style="color: #339933;">        &lt;![CDATA[</span>
<span style="color: #339933;">            import mx.controls.ComboBox;</span>
&nbsp;
<span style="color: #339933;">            private var arr:Array;</span>
<span style="color: #339933;">            private var comboBox:ComboBox;</span>
&nbsp;
<span style="color: #339933;">            private function init():void {</span>
<span style="color: #339933;">                arr = [];</span>
<span style="color: #339933;">                arr.push({label:&quot;One&quot;});</span>
<span style="color: #339933;">                arr.push({label:&quot;Two&quot;});</span>
<span style="color: #339933;">                arr.push({label:&quot;Three&quot;});</span>
<span style="color: #339933;">                arr.push({label:&quot;Four&quot;});</span>
<span style="color: #339933;">                arr.push({label:&quot;Five&quot;});</span>
<span style="color: #339933;">                arr.push({label:&quot;Six&quot;});</span>
<span style="color: #339933;">                arr.push({label:&quot;Seven&quot;});</span>
<span style="color: #339933;">                arr.push({label:&quot;Eight&quot;});</span>
<span style="color: #339933;">                arr.push({label:&quot;Nine&quot;});</span>
<span style="color: #339933;">                arr.push({label:&quot;Ten&quot;});</span>
&nbsp;
<span style="color: #339933;">                comboBox = new ComboBox();</span>
<span style="color: #339933;">                comboBox.dataProvider = arr;</span>
<span style="color: #339933;">                comboBox.dropdownWidth = 200;</span>
<span style="color: #339933;">                addChild(comboBox);</span>
<span style="color: #339933;">            }</span>
<span style="color: #339933;">        ]]&gt;</span>
<span style="color: #339933;">    &lt;/mx:Script&gt;</span>
&nbsp;
<span style="color: #000000;"><span style="color: #7400FF;">&lt;/mx:Application</span><span style="color: #7400FF;">&gt;</span></span></pre></div></div>

<div class="evernoteSiteMemory"><a href="javascript:" onclick="Evernote.doClip({title: 'Setting the width of the dropdown menu on a ComboBox control in Flex on FlexExamples.com',url: 'http://blog.flexexamples.com/2008/07/02/setting-the-width-of-the-dropdown-menu-on-a-combobox-control-in-flex/',contentID: 'post-693',code: 'Pete9667',suggestNotebook: 'FlexExamples',suggestTags: 'dropdownWidth',providerName: 'FlexExamples.com',styling: 'text' });return false" class="evernoteSiteMemoryLink"><img src="http://static.evernote.com/article-clipper-remember.png" class="evernoteSiteMemoryButton" />
				</a>				<div class="evernoteSiteMemoryClear">&nbsp;</div>
</div>]]></content:encoded>
			<wfw:commentRss>http://blog.flexexamples.com/2008/07/02/setting-the-width-of-the-dropdown-menu-on-a-combobox-control-in-flex/feed/</wfw:commentRss>
		<slash:comments>6</slash:comments>
		</item>
	</channel>
</rss>

