연습장2007.02.20 13:01

사용자 삽입 이미지
http://211.52.77.74:8080/test/flex2/postmemo/



비밀번호 사용가능하게 만들었네요..

예전에 그냥 해두었더니 누가 다 지워버려서..


툴팁으로 저장된 사람 ip도 나오게 해놓았습니다. 여과없이 -.-;




디스켓 아이콘 - 저장

x 아이콘 - 삭제



저장이나 삭제시에 비밀번호 입력이 나옵니다.

저장시에 입력하시면 비번이 저장되고

삭제시엔 입력한 비번을 입력하시면 되고요..




소스보기 가능하게 해놓았습니다..

좋은 하루 되세요..


아참.. 버그 있으면 거침없이 쪽지를 붙여주세요.


p.s. 회사쪽 mssql 서버가 맛이 가서 -.-;; 임시로

9~ 6시 사이는 제 노트북으로 연결시켜놓았네요.. 다른 시간대엔 꺼둘지도;;

'연습장' 카테고리의 다른 글

AIR 번역기입니다. (AIR Translator)  (4) 2008.06.27
닥터후 퍼즐 - 시즌3  (3) 2007.07.04
퍼즐  (0) 2007.07.04
붙임쪽지 (like post it )  (2) 2007.02.20
붙임 쪽지(포스트 잇) 구현 중  (1) 2007.02.16
flash card 5*3  (0) 2007.01.28
Posted by 시난
프로그래밍/Flex/AIR2007.02.16 22:00
아직 닫기, 최소화, 최대화, 등의 아이콘은 붙이지 않았지만..
생각했던 구현 방법에 대한 구현을 한 것이고요..

나중에 붙임쪽지 기능 밑.. 다른데 적용시키려고 테스트 해보았습니다..
이동시 어긋남이 있는데 Panel 의 타이틀박스 부분에 이동 핸들링을 시작하지 않아서 그렇고, 조금 수정하면 될거에요..


Posted by 시난
연습장2007.02.16 21:46
sql 서버가 노트북이라서 켜놓지를 못하네요.
시간되는대로 회사 서버에 연결해놓고 다시 올리겠습니다. ^^;


'연습장' 카테고리의 다른 글

AIR 번역기입니다. (AIR Translator)  (4) 2008.06.27
닥터후 퍼즐 - 시즌3  (3) 2007.07.04
퍼즐  (0) 2007.07.04
붙임쪽지 (like post it )  (2) 2007.02.20
붙임 쪽지(포스트 잇) 구현 중  (1) 2007.02.16
flash card 5*3  (0) 2007.01.28
Posted by 시난
프로그래밍/Flex/AIR2007.02.16 01:10

제대로 하기 위해선,
패널 안쪽에서 이벤트 발생이 필요하다.

구석진 곳(상하, 좌우 이동 커서로 변하게 하는 장소)을 클릭했을 때와
마우스 업 이벤트 시에

상위 컨테이너로 이벤트를 전달하여,
패널의 확장 및 축소를 해야하는지 말아야 하는지 제어해야 한다.

Posted by 시난
TAG flex, panel
프로그래밍/Flex/AIR2007.01.30 14:19

출처 : [On Reflexion]

http://onreflexion.blogspot.com/2007/01/napkin-skins-stage-two-programmatic.html 



We can build on stage one by using programmatic skins (click on the screenshot to see
the app):

There were no significant changes to the MXML file: the only change is the reference to the CSS stylesheet. Looking at scrawl3.css (when you select View Source in the app's context menu), we see that the changes to the stylesheet are limited to styles that are specified as ClassReferences, for example:

    track-skin: ClassReference('skins.scrawl.ScrollTrackSkin');
These are references to programmatic skins written in ActionScript, which you can find in the source tree under skins.scrawl. The simplest one, ScrollTrackSkin.as, specifies the skin for the ScrollBar's track (but not for the thumb or the arrow). The drawing happens in the overridden method updateDisplayList() and, aside from a drawing a simple border around the track, does only one interesting thing:
    // fill with zero alpha: if no fill, mouse events are not recognized
drawRoundRect(1, 1, w-2, h-2, 0, 0x000000, 0.0);
I found that, without this line, clicking on the track does not move the ScrollBar thumb to the location of the click -- the mouse event is ignored, presumably because it doesn't hit any area drawn by the track skin. My solution for that was to add an invisible background for the track. I have also used this solution in my other programmatic skins, but I am not sure that this is the "recommended" way to address this issue.

Another simple programmatic skin is ScrollArrowSkin.as. Someone with a different balance of graphical vs. coding skills would have probably created this as a graphical skin. For me, this was the simplest way to go. One advantage of using the programmatic skin is that you can make slight variations for up-/over-/down-skins within the same skin class. In this case, I have used conditions on the skin's name to determine the color and direction of the arrow, which allowed me to use the same skin class for all ScrollBar arrow skins:
    down-arrow-down-skin: ClassReference('skins.scrawl.ScrollArrowSkin');
down-arrow-over-skin: ClassReference('skins.scrawl.ScrollArrowSkin');
down-arrow-up-skin: ClassReference('skins.scrawl.ScrollArrowSkin');
...
up-arrow-down-skin: ClassReference('skins.scrawl.ScrollArrowSkin');
up-arrow-over-skin: ClassReference('skins.scrawl.ScrollArrowSkin');
up-arrow-up-skin: ClassReference('skins.scrawl.ScrollArrowSkin');
Programmatic skins also allow for some nifty tricks. The code in ComboBoxSkin.as that draws the border of the ComboBox uses Math.random() to draw it differently every time:
    g.moveTo(Math.random() * borderThickness, Math.random() * borderThickness);
g.lineTo(w - (Math.random() * borderThickness), Math.random() * borderThickness);
g.moveTo(w - (Math.random() * borderThickness), Math.random() * borderThickness);
g.lineTo(w - (Math.random() * borderThickness), h - (Math.random() * borderThickness));
...
This helps give the ComboBox that ragged scrawled-on-a-napkin look: the border is different for the up-, over- and down-skins. If you play with the box dividers, you'll see that the ComboBox redraws itself with a slightly different border, even for the same skin. A similar principle is at work for the DataGrid's border (in ScrawlBorder.as), as well as for the cross-hatch pattern for the ScrollBar thumb skin (ScrollThumbSkin.drawCrossHatch()) and the ComboBox's down-skin (ScrawlUtil.drawCrossHatch() in the util package):
    // draw \\\\\\\\
for(i = -h; i < w; i += 6)
{
vstart = Math.max(-i, 0);
vdistance = Math.min(h, w - i);
vstartOffset = vstart + 3 - (6 * Math.random());
g.moveTo(i + vstartOffset, vstartOffset);
g.lineTo(i + vdistance, vdistance + 2 - (4 * Math.random()));
}

// draw ////////
for(i = 0; i < w + h; i += 6)
{
vstart = Math.max(i - w, 0);
vdistance = Math.min(h, i);
vstartOffset = vstart + 3 - (6 * Math.random());
g.moveTo(i - vstartOffset, vstartOffset);
g.lineTo(i - vdistance, vdistance + 2 - (4 * Math.random()));
}
Once again, programmatic skins allow us to call this code only for the ComboBox's down-skin while reusing the same class for all three skins:
    down-skin: ClassReference('skins.scrawl.ComboBoxSkin');
over-skin: ClassReference('skins.scrawl.ComboBoxSkin');
up-skin: ClassReference('skins.scrawl.ComboBoxSkin');
As one final touch, the DataGrid's border looks like it was drawn with a marker, with varying pressure on the marker producing color variations along the way. This effect is accomplished by specifying the following gradient type in ScrawlBorder.updateDisplayList():
    g.lineGradientStyle(GradientType.LINEAR, [borderColor, borderColor], [1.0, 0.5], [0, 255],
null, SpreadMethod.REFLECT);












재밌는 스킨 제작법!
Posted by 시난
TAG flex, Skin
프로그래밍/Flex/AIR2007.01.30 09:54


Help에 있던 예제
소팅시엔 적용이 되긴 하지만, 예전에 그려줬던게 남아있다.
버그인가?


<?xml version="1.0" encoding="iso-8859-1"?>
<!-- itemRenderers\asRenderer\MainASItemRenderer.mxml -->

<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
    width="600" height="600">

    <mx:Script>
        <![CDATA[
            import mx.collections.ArrayCollection;
       
            [Bindable]               
            private var initDG:ArrayCollection = new ArrayCollection([
                {Monday: 12, Tuesday: 22, Wednesday: 452, Thursday: 90},
                {Monday: 258, Tuesday: 22, Wednesday: 45, Thursday: 46},
                {Monday: 4, Tuesday: 123, Wednesday: 50, Thursday: 95},
                {Monday: 12, Tuesday: 52, Wednesday: 111, Thursday: 20},
                {Monday: 22, Tuesday: 78, Wednesday: 4, Thursday: 51}
            ]);
        ]]>
    </mx:Script>

    <mx:Text text="All cells over 100 are red" />
   
    <mx:DataGrid id="myDataGrid"
        dataProvider="{initDG}"
        variableRowHeight="true">
        <mx:columns>
            <mx:DataGridColumn dataField="Monday"
                itemRenderer="myComponents.CellField" />
            <mx:DataGridColumn dataField="Tuesday"
                itemRenderer="myComponents.CellField" />
            <mx:DataGridColumn dataField="Wednesday"
                itemRenderer="myComponents.CellField" />
            <mx:DataGridColumn dataField="Thursday"
                itemRenderer="myComponents.CellField" />
        </mx:columns>
    </mx:DataGrid>
</mx:Application>




package myComponents {

    // myComponents/CellField.as
    import mx.controls.*;
    import mx.core.*;
    import mx.controls.dataGridClasses.DataGridListData;

    public class CellField extends TextInput
    {
        // Define the constructor and set properties.
        public function CellField() {
            super();
            height=60;
            width=80;
            setStyle("borderStyle", "none");
            editable=false;
        }

        // Override the set method for the data property.
        override public function set data(value:Object):void {
            super.data = value;
      
            if (value != null)
            {
                text = value[DataGridListData(listData).dataField];
                if(Number(text) > 100)
                {
                    setStyle("backgroundColor", 0xFF0000);
                }
            }

            super.invalidateDisplayList();
        }
    }
}

Posted by 시난
TAG flex
프로그래밍/Flex/AIR2007.01.27 10:55



예전 Flex 2.0 버젼에 되어있던 effect가 initInstance() 부분이 바뀌었다.
2.0.1. 에서 사용하기 위해서는
Library 프로젝트를 만들고 이 소스(the DistortionEffects Flex2 component)를 연 다음

com.adobe.ac.mxeffects 안에 있는
Flips.as 에서


line 51을
override protected function initInstance( instance : EffectInstance ) : void
{
 ...
}

다음과 같이 바꾸어야 한다.
override protected function initInstance( instance : IEffectInstance ) : void
 {
...
}

그리고
위의 임포트 영역에 다음을 추가한다.
import com.adobe.ac.mxeffects.effectClasses.FlipInstance;

그리고 컴파일 해서 swc를 이용하면 끝.. ^^

p.s.
Flip 말고 door 라든가 다른 효과 모두 동일하게 바꿔야 한다.. ^^:;;;;;


DistortionEffect/CubeEffect 만든 사람 :
DistortionEffect/CubeEffect of Alex Uhlmann

Posted by 시난