リストの末尾にある境界線を削除する

Question

ハイライト部分が赤色です！どうすれば削除できますか？レンダリングリストのコードは次のとおりです。

<s:List id="ui_lstIndexList" width="175" height="600" fontFamily="TwinCen" 
       fontSize="24" 
       alternatingItemColors="[]" borderVisible="false" downColor="#7fceff" 
       change="showAlert(event)" contentBackgroundColor="#6fa8bc" color="#FFFFFF" 
       dataProvider="{indexArrayCollection}" selectionColor="#7fceff"> 
      <s:itemRenderer> 
       <fx:Component> 
        <s:IconItemRenderer labelField="name" messageField="artist"/> 
       </fx:Component> 
      </s:itemRenderer> 
     </s:List> 

ありがとうございます！

Answer 1

IconItemRendererをクリックし、「skinClass」と入力します。コード補完を使用すると、「新しいスキン...」のオプションが提供されます。これを使用して、編集可能な新しいスキンを作成します。それがなければ、Listスキンに含まれます。

Answer 2

"簡単な"ことではありません。 IconItemRendererを拡張するカスタムクラスを作成し、そこからprotected function drawBackground(unscaledWidth:Number, unscaledHeight:Number):voidをオーバーライドする必要があります。関数の終わりにセパレータを描画する部分を削除する必要があります。私が知っている、それはばかげだ、彼らはそのためのスタイルを持っていたのはずですが、あなたは常に自分自身を実装することができます：

protected function drawBackground(unscaledWidth:Number, 
            unscaledHeight:Number):void 
{ 
    // figure out backgroundColor 
    var backgroundColor:*; 
    var downColor:* = getStyle("downColor"); 
    var drawBackground:Boolean = true; 

    if (down && downColor !== undefined) 
    { 
     backgroundColor = downColor; 
    } 
    else if (selected) 
    { 
     backgroundColor = getStyle("selectionColor"); 
    } 
    else if (hovered) 
    { 
     backgroundColor = getStyle("rollOverColor"); 
    } 
    else if (showsCaret) 
    { 
     backgroundColor = getStyle("selectionColor"); 
    } 
    else 
    { 
     var alternatingColors:Array; 
     var alternatingColorsStyle:Object = getStyle("alternatingItemColors"); 

     if (alternatingColorsStyle) 
      alternatingColors = (alternatingColorsStyle is Array) ? (alternatingColorsStyle as Array) : [alternatingColorsStyle]; 

     if (alternatingColors && alternatingColors.length > 0) 
     { 
      // translate these colors into uints 
      styleManager.getColorNames(alternatingColors); 

      backgroundColor = alternatingColors[itemIndex % alternatingColors.length]; 
     } 
     else 
     { 
      // don't draw background if it is the contentBackgroundColor. The 
      // list skin handles the background drawing for us. 
      drawBackground = false; 
     } 

    } 

    // draw backgroundColor 
    // the reason why we draw it in the case of drawBackground == 0 is for 
    // mouse hit testing purposes 
    graphics.beginFill(backgroundColor, drawBackground ? 1 : 0); 
    graphics.lineStyle(); 
    graphics.drawRect(0, 0, unscaledWidth, unscaledHeight); 
    graphics.endFill(); 

    var topSeparatorColor:uint; 
    var topSeparatorAlpha:Number; 
    var bottomSeparatorColor:uint; 
    var bottomSeparatorAlpha:Number; 

    // Selected and down states have a gradient overlay as well 
    // as different separators colors/alphas 
    if (selected || down) 
    { 
     var colors:Array = [0x000000, 0x000000 ]; 
     var alphas:Array = [.2, .1]; 
     var ratios:Array = [0, 255]; 
     var matrix:Matrix = new Matrix(); 

     // gradient overlay 
     matrix.createGradientBox(unscaledWidth, unscaledHeight, Math.PI/2, 0, 0); 
     graphics.beginGradientFill(GradientType.LINEAR, colors, alphas, ratios, matrix); 
     graphics.drawRect(0, 0, unscaledWidth, unscaledHeight); 
     graphics.endFill(); 
    } 

    // separators are a highlight on the top and shadow on the bottom 
    /* OLD WAY OF DOING IT 
    topSeparatorColor = 0xFFFFFF; 
    topSeparatorAlpha = .3; 
    bottomSeparatorColor = 0x000000; 
    bottomSeparatorAlpha = .3; 
    */ 

    // NEW WAY 
    topSeparatorColor = getStyle('topSeparatorColor'); 
    topSeparatorAlpha = getStyle('topSeparatorAlpha'); 
    bottomSeparatorColor = getStyle('bottomSeparatorColor'); 
    bottomSeparatorAlpha = getStyle('bottomSeparatorAlpha'); 


    // draw separators 
    // don't draw top separator for down and selected states 
    if (!(selected || down)) 
    { 
     graphics.beginFill(topSeparatorColor, topSeparatorAlpha); 
     graphics.drawRect(0, 0, unscaledWidth, 1); 
     graphics.endFill(); 
    } 

    graphics.beginFill(bottomSeparatorColor, bottomSeparatorAlpha); 
    graphics.drawRect(0, unscaledHeight - (isLastItem ? 0 : 1), unscaledWidth, 1); 
    graphics.endFill(); 


    // add extra separators to the first and last items so that 
    // the list looks correct during the scrolling bounce/pull effect 
    // top 
    if (itemIndex == 0) 
    { 
     graphics.beginFill(bottomSeparatorColor, bottomSeparatorAlpha); 
     graphics.drawRect(0, -1, unscaledWidth, 1); 
     graphics.endFill(); 
    } 

    // bottom 
    if (isLastItem) 
    { 
     // we want to offset the bottom by 1 so that we don't get 
     // a double line at the bottom of the list if there's a 
     // border 
     graphics.beginFill(topSeparatorColor, topSeparatorAlpha); 
     graphics.drawRect(0, unscaledHeight + 1, unscaledWidth, 1); 
     graphics.endFill(); 
    } 


} 

そして、ここから、あなただけのtopSeparatorColor、アルファ、または他のスタイルを設定する必要があります。あるいは、すべてを変更して、それらをすべて隠すだけの 'showSeparator'スタイルを持つこともできます。あなたはそれで何でもできます。