JavaFX는 신뢰할 수 있는지에 대해서 동의만 얻으면 로컬에 있는 파일에 접근할 수 있습니다. 그렇다는 얘기는 JavaFX로 사용자 컴퓨터를 맛이가게 할 수 있는건가....-_-
JavaFX는 브라우저에서 돌아갈 때 오래전에 영광을 누렸던 Applet기반으로 돌아갑니다. 예전엔 채팅사이트나 왠만한 사이트에 Applet이 꼭 들어갔었죠. 보안문제나 속도문제 때문에 아마 Flash에 밀렸을겁니다.
혹시나 했는데 스카이러브라는 예전에 유명했던 채팅사이트는 아직도 애플릿을 사용하네요-_-

암튼 JavaFX에서 사운드재생은 Flash처럼 매우 간단합니다.
MediaPlayer라는 클래스가 있습니다.
http://java.sun.com/javafx/1.1/docs/api/javafx.scene.media/javafx.scene.media.MediaPlayer.html
그리고 Media라는 클래스가 있습니다.
http://java.sun.com/javafx/1.1/docs/api/javafx.scene.media/javafx.scene.media.Media.html

[code]
var mediaPlayer:MediaPlayer = MediaPlayer {
    volume: 0.5
    autoPlay: false
    onError: function(e:MediaError) {
        println("got a MediaPlayer Error : {e.cause} {e}");
    }
    onEndOfMedia: function() {
        println("reched end of media");
        playList.next();
    }
}

mediaPlayer.media = Media {
    source: "URL경로 및 FILE경로",
    onError: function(e:MediaError) {
        println("got a media error {e}");
    }
}
mediaPlayer.play()
[/code]
이렇게 하면 됩니다. 아....URL은 그냥 http://www.~~~.com/1.mp3 이렇게 하면 되는데요. 로컬에 있는 파일을 읽어올 경우에는 C:\1.MP3 이게 아니더군요.
file:/D:/임재범-비상.mp3 이렇게 해야되더군요.

아 그리고, JavaFX에서는 flash에 있는 DataGrid같은 게 없습니다-_- swing컴포넌트를 이용해서 만들어야해요. 구글링을 해보니 JTable로 만들어 놓은 게 있더라구요. 그걸 이용해서 플레이리스트르 만들었습니다.

근데, 가끔 브라우저(FireFox나 IE, Opeara는 안됨ㅠ)에서 버튼이 클릭이 안될 때가 있습니다-_- 왜그런지 모르겠네요. 근데 크롬은 100%클릭이 잘 됩니다. 왜그럴까요....-_- 테스트 하시는 분들은 크롬으로 하세요 ^^ 크롬짱-_-
사용자 삽입 이미지

이미지에요-_- 주소는 아래에-_-


예제 데모주소입니다(크롬으로....-_-)
http://mudchobosample.appspot.com/JavaFXMP3Player/JavaFXMP3Player.html

소스주소입니다.
http://my-svn.assembla.com/svn/mudchobosample/trunk/JavaFXMP3Player/

 
Posted by 머드초보

댓글을 달아 주세요

 
저번에 Beta2예제가 새로운 버전에서 안돌아가는 바람에 다시 만들었습니다-_-;
많은 분들이 안돌아간다고 하셔서 다시 만들었습니다 ㅠ
형식이 조금 바뀌었는데, 별 차이는 없었습니다.
더 편해진 것 같아요. 토큰이라는 것을 이용하네요.

http://code.google.com/p/assql/
다양한 예제와 lib파일은 이곳에서 받을 수 있습니다.

간단하게 insert와 select를 하는 예제를 만들어봤습니다.
테스트 해본 환경은 Eclpse3.4 + Flex Builder 3.0.1 + asSQL Beta 2.7에서 해봤습니다.

DB구조는 다음과 같습니다.
[code]
CREATE TABLE `products` (
  `id` int(10) unsigned NOT NULL auto_increment,
  `description` varchar(45) default NULL,
  `price` decimal(15,2) NOT NULL default '0.00',
  PRIMARY KEY  USING BTREE (`id`,`price`)
) ENGINE=InnoDB AUTO_INCREMENT=11 DEFAULT CHARSET=utf8;

INSERT INTO `products` (`id`,`description`,`price`) VALUES
 (1,'Lamp','469.80'),
 (2,'Table','3502.62'),
 (3,'Chair','1061.12');
[/code]

아래는 소스코드입니다.
[code]
<?xml version="1.0" encoding="utf-8"?>
<mx:Application
    xmlns:mx="http://www.adobe.com/2006/mxml"
    creationComplete="onCreationComplete()"
    layout="horizontal">
    <mx:Script>
        <![CDATA[
            import mx.collections.ArrayCollection;
            import com.maclema.mysql.ResultSet;
            import com.maclema.mysql.MySqlToken;
            import com.maclema.mysql.Statement;
            import com.maclema.mysql.Connection;
            import com.maclema.mysql.events.MySqlErrorEvent;
            import mx.rpc.AsyncResponder;
            import mx.controls.Alert;
           
            private var con:Connection;
            private var st:Statement;
            private var token:MySqlToken;
            [Bindable]
            private var dataAC:ArrayCollection;
           
            private function onCreationComplete():void
            {
                con = new Connection("DB주소", 3306, "DB아이디", "DB비밀번호", "DB명");
                con.addEventListener(Event.CONNECT, handleConnected);
                con.connect("euckr");
            }
           
            private function handleConnected(e:Event):void
            {
                if (con != null)
                {
                    st = con.createStatement();
                }
            }
           
            private function selectResult(data:Object, token:Object):void
            {
                var rs:ResultSet = ResultSet(data);
                dataAC = rs.getRows();                               
            }
           
            private function insertResult(data:Object, token:Object):void
            {
                Alert.show(token.description + " 삽입성공!");
                selectProcess();
                insertBox.visible = false;
            }
           
            private function fault(info:Object, token:Object):void
            {
                Alert.show("Error: " + info);   
            }
           
            private function selectProcess():void
            {
                var token:MySqlToken = st.executeQuery(
                    "SELECT id, description, price FROM products");
                token.addResponder(new AsyncResponder(selectResult, fault));   
            }
           
            private function insertProcess():void
            {
                st.sql = "INSERT INTO products (description, price) VALUES (?, ?)";
                st.setString(1, inputDescription.text);
                st.setNumber(2, Number(inputPrice.text));
                var token:MySqlToken = st.executeQuery();
                token.description = inputDescription.text;
                token.addResponder(new AsyncResponder(insertResult, fault, token));
            }
        ]]>
    </mx:Script>
   
    <mx:VBox horizontalAlign="center">
        <mx:DataGrid id="productDG" dataProvider="{dataAC}">
            <mx:columns>
                <mx:DataGridColumn headerText="ID" dataField="id"/>
                <mx:DataGridColumn headerText="제품명" dataField="description"/>
                <mx:DataGridColumn headerText="가격" dataField="price"/>
            </mx:columns>
        </mx:DataGrid>
       
        <mx:HBox width="100%" horizontalAlign="center">
            <mx:Button label="SELECT" id="btnSelect"
                click="insertBox.visible = false; selectProcess()"/>
            <mx:Button label="INSERT" id="btnInsert"
                click="insertBox.visible = true"/>
        </mx:HBox>
       
        <mx:VBox id="insertBox" height="100%" horizontalAlign="center" visible="false">
            <mx:Form>
                <mx:FormHeading label="정보 입력" />
                <mx:FormItem label="제품명">
                    <mx:TextInput id="inputDescription" />
                </mx:FormItem>
                <mx:FormItem label="가격">
                    <mx:TextInput id="inputPrice" restrict="0-9,."/>
                </mx:FormItem>
            </mx:Form>
            <mx:Button id="btnInsertProcess" label="추가" click="insertProcess()" />
        </mx:VBox>
       
    </mx:VBox>
       
</mx:Application>
[/code]
좀 이상한 점이 con.connect("euckr")로 해야지 한글이 나오더군요. mysql에서 utf8에는 한글이 없는건가.
어쨌든 인코딩은 어려워요 ㅠ

Connection이라는 클래스를 통해 mysql정보를 이용해 con객체를 생성한다음에 Statement를 생성합니다.
그 뒤에 selectProcess메소드에서 보시면, MySqlToken이라는 클래스를 이용합니다. Statement객체의 executeQuery메소드에 쿼리문을 넣어서 실행하면 token이 발행됩니다.
이 token에 addResponder라는 메소드를 통해 AsyncResponder를 이용해 해당 function넣은 객체를 생성해서 addResponder에 집어넣습니다. 그러면 데이터를 가져오는 시점에서 넣은 function이 호출이 됩니다.

여기서 데이터를 파싱하는 부분에서 엄청 편해진 부분이있는데요.
[code]rs.getRows();
[/code]
getRows라는 메소드가 있는데, 이건 해당 데이터셋을 자동으로 ArrayCollection형으로 변환해서 리턴해줍니다.
그러면 바로 바인딩된 datagrid에 데이터가 뿌려지겠죠. 멋집니다.

insert부분도 똑같습니다.
그냥 자바문법과 비슷하다고 보면 되겠네요.
틀린 점이 있다면 이건 이벤트기반이라는 것이죠 ^^ 비동기적으로 일어납니다.
사용자 삽입 이미지

셀렉트도 잘되네요. 구글크롬에서 해봤어요. 잘 되네요.

사용자 삽입 이미지

머드초보를 2.00로 해서 입력해봅시다.

사용자 삽입 이미지

잘 들어갔네요.

PS. 실무db연동은....서버단언어와 함께하시길 바랍니다 ^^ (JAVA, C# 등등~)
 
Posted by 머드초보

댓글을 달아 주세요

  1. 이전 댓글 더보기

 

정말 초간단예제군요-_-;
어노테이션을 사용하면 굉장히 편해져요.
저번주 스터디시간에 한 내용을-_-;

AOP를 적용하려면 인터페이스가 있어야 돼요.
Apple이라는 인터페이스를 만들어 봅시다.
com.mudchobo.example4라는 패키지에 Apple이라는 interface를 만듭시다.
Apple.java
[code]
package com.mudchobo.example4;

public interface Apple {
 public void println();
}
[/code]
println이라는 메소드가 하나있네요. 구현해봅시다.
AppleImpl.java
[code]
package com.mudchobo.example4;

public class AppleImpl implements Apple {

 @Override
 public void println(){
  System.out.println("Apple : 맛있다");
 }
}
[/code]
사과는 맛있다 라는 메시지를 출력하는군요. 그럼 AOP....(갑자기 두리녀석이 전화를..-_-; 갑자기 2시간남겨놓고 술먹자고 전화하는 이상한놈이네요-_-;)
AOP 클래스를 만들어봅시다.
[code]
package com.mudchobo.example4;

import org.aspectj.lang.ProceedingJoinPoint;
import org.aspectj.lang.annotation.Around;
import org.aspectj.lang.annotation.Aspect;

@Aspect
public class AnnotLoggingAspect {

 @Around("execution(public * com.mudchobo.example4.*.println*(..))")
 public void logging(ProceedingJoinPoint joinPoint) {
  String methodName = joinPoint.getSignature().getName();
 
  try {
   System.out.println("before : " + methodName);
   joinPoint.proceed();
   System.out.println("after : " + methodName);
  } catch (Throwable e) {
   System.out.println("예외가 발생했어요!");
  }
 }
}
[/code]
Around는 before, after, 예외 등을 다 포함하고 있죠. 그냥 메소드하나 구현하는거라고 보면 돼요.
execution은 AspectJ의 정규식을 넣으면 돼요. 문법은 검색 고고싱~--;
저건 맨앞에는 public, private정하는거고, 두번째는 리턴타입(*면 전부다겠죠?), 그다음은 패키지명 쓰고, (..)부분은 파라메터관련된 부분이죠. 검색고고싱~
저건 com.mudchobo.example4패키지에서 모든클래스중에 println으로 시작하는 메소드에 aop를 적용하겠다는 얘기에요. println메소드는 우리가 방금 구현한 Apple인터페이스에 있죠.

스프링 설정파일을 봅시다. 최상위 폴더에 applicationContext.xml파일로 지정합시다.
[code]
<?xml version="1.0" encoding="UTF-8"?>
<beans xmlns="http://www.springframework.org/schema/beans"
 xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
 xmlns:aop="http://www.springframework.org/schema/aop"
 xsi:schemaLocation="
  http://www.springframework.org/schema/beans
  http://www.springframework.org/schema/beans/spring-beans-2.5.xsd
        http://www.springframework.org/schema/aop
        http://www.springframework.org/schema/aop/spring-aop-2.5.xsd">

 <aop:aspectj-autoproxy />
 
 <bean id="apple" class="com.mudchobo.example4.AppleImpl" />

 <bean class="com.mudchobo.example4.AnnotLoggingAspect" />
 
</beans>
[/code]
자 보면, apple이라는 bean은 우리가 만든 사과클래스구요. aop클래스를 bean으로 해서 선언해주었어요.
만약 SpringIDE를 설치했다면 왼쪽에 보시면 aop가 어디에 또는 몇개 적용이 되어있는지 나와요.
그럼 메인클래스를 보도록 해요.

Main4.java
[code]
package com.mudchobo.example4;

import org.springframework.context.ApplicationContext;
import org.springframework.context.support.ClassPathXmlApplicationContext;

public class Main4 {

 public static void main(String[] args) {
  String configLocation = "applicationContext.xml";
  ApplicationContext context = new ClassPathXmlApplicationContext(configLocation);
  Apple apple = (Apple) context.getBean("apple");
  apple.println();
 }
}
[/code]
설정파일을 불러와서 ApplicationContext를 만들고, 거기서 apple이라는 bean을 불러옵니다.
그리고, apple.println()메소드를 호출하게 되면 aop가 적용되어 호출됩니다.

before : println
Apple : 맛있다
after : println

PS.회사프로그램에 스프링을 이용해서 AOP를 적용해보았는데요. 코드가 깔끔해지고, 참 좋은 것 같아요.
회사프로그램에서 예외처리하는 부분이 굉장히 많았는데 이것을 따로 빼서 하나로 합치니-_-; 코드가독성이 올라가네요. 암튼, 좀 더 배워봐야겠네요.
 
Posted by 머드초보

댓글을 달아 주세요

 

어찌하다보니 스트럿츠2를 공부하게 되었네요.
책에 있는 예제를 이클립스로 셋팅법과 간단한 예제를 소개하려고 합니다-_-;
이 책에서 톰캣플러그인으로 사용하길래 그냥 Dynamic Web Project로 만들어도 될듯해서 ^^
(예제출처 : 스트럿츠2 프로그래밍 - 현철주, 정광선, 민상기 지음)

테스트환경 : Tomcat 6.0.16 + JDK 6 u 4 + Struts 2.0.11

이클립스를 실행합니다.
File -> New -> Project -> Dynamic Web Project선택
Project name을 HelloStruts2로 하고~ ^^
Target Runtime은 톰캣 6.0으로 추가를 해봅시다 ^^ New해서 Apache Tomcat 6.0선택하고 톰캣이 설치된 경로만 지정해주면 돼요 ^^
그리고 Finish를 클릭합시다 ^^

아.....스트럿츠2를 받아야죠! http://struts.apache.org/download.cgi 여기서 Struts 2.0.11버전을 받습니다.
압축을 풀고 lib경로에 있는 파일들을 방금 만든 프로젝트경로의 lib폴더로 복사합니다.
antlr-2.7.2.jar
commons-beanutils-1.6.jar
commons-chain-1.1.jar
commons-logging-1.0.4.jar
commons-logging-api-1.1.jar
commons-validator-1.3.0.jar
freemarker-2.3.8.jar
ognl-2.6.11.jar
oro-2.0.8.jar
struts2-core-2.0.11.jar
struts-core-1.3.5.jar
xwork-2.0.4.jar

플러그인만 빼고 다 복사하면 돼요. 플러그인도 같이 복사하면 에러나요-_-; 해당 lib가 없어서 그런 것 같아요. spring plugin이런것을 사용하려면 spring lib가 있어야 하는 듯 해요 ^^

그다음 web.xml파일에 아래와 같은 filter를 추가해줍니다.
[code]
<filter>
   <filter-name>struts</filter-name>
   <filter-class>org.apache.struts2.dispatcher.FilterDispatcher</filter-class>
</filter>
 
<filter-mapping>
   <filter-name>struts</filter-name>
   <url-pattern>/*</url-pattern>
</filter-mapping>
[/code]

Java Resources : src에 오른쪽 마우스를 대고 struts.xml파일을 하나 추가해줍시다.
이눔은 빌드되면서 classes폴더로 들어가게 됩니다.

struts.xml
[code]
<?xml version="1.0" encoding="UTF-8"?>

<!DOCTYPE struts PUBLIC "-//Apache Software Foundation//DTD Struts
Configuration 2.0//EN" "http://struts.apache.org/dtds/struts-2.0.dtd">
 
<struts>
 <package name="default" extends="struts-default" namespace="">
 
  <action name="echo" class="example.chapter3.EchoAction">
   <result>/WEB-INF/echo.jsp</result>
  </action>
 
 </package>
</struts>
[/code]
보면 struts1이랑 비슷해요. 대신 이눔은 package라는 놈이 있어서 비슷한 놈들 끼리 묶을 수 있어요.

이제 저 example.chapter3.EchoAction을 만들어 봅시다.
Java Resources: src에 오른쪽 마우스를 대고! EchoAction클래스를 하나 만듭시다.
EchoAction.java
[code]
package example.chapter3;

public class EchoAction {
 private String echo;
 
 public String execute() throws Exception {
  return "success";
 }

 public String getEcho() {
  return echo;
 }

 public void setEcho(String echo) {
  this.echo = echo;
 }
}
[/code]
요렇게 작성을 합니다. 보면 execute가 있네요. 그리고 get, set이 있구요.

이제 action에 작성한 jsp를 작성해봅시다.
WEB-INF에 오른쪽마우스를 클릭해서 JSP를 선택해서 추가합니다.
아까 ACTION에서 작성한 echo.jsp파일을 생성합시다.
echo.jsp
[code]
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ taglib prefix="s" uri="/struts-tags" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>예제3-1: echo</title>
</head>
<body>

<s:form action="echo" theme="simple">
 <s:textfield name="echo" />
 <p/><s:property value="echo" /></p>
 <s:submit />
</s:form>
</body>
</html>
[/code]
간단히 보면 스트럿츠태그가 있습니다. 예전에 쓰던 <html:, <bean: 보다 더 좋아진 듯 합니다.
신기한 건 s:textfield해놓고, name을 echo로만 줘도 setter가 작동하는 듯 합니다-_-;
s:property도 getter가 그냥 작동하는 듯 합니다. 뭐 아직 저도 잘몰라서 뭐라 말은 못하겠네요.
어쨌든 이제 실행시켜보고 field에 뭐라고 쓰면 뭐라고 나올 껍니다-_-;

url은 http://localhost:8080/HelloStruts2/echo.action 로 요청합니다 ^^

사용자 삽입 이미지


음....더 공부를 해봐야할 것 같네요 ^^
 
Posted by 머드초보

댓글을 달아 주세요

 

머리나쁘면 평생고생한다더니 그말이 맞습니다!
이거 소스코드 한줄만 고치면 되는 것을 저는 그것도 모르고 계속 샘플분석했어요--;
AIR프로젝트를 만들게 되면 xml이 자동으로 만들어지게 되는데 저는 그건 제가 관리하는게 아니라고 생각했는데 아니더군요. 안에 보면 셋팅할 수 있는게 몇개 있더군요 ^^

우선 기존 윈도우틀을 없애봅시다.

File -> New -> Flex Project를 선택하시고, ProjectName은 NoneWindowApp라고 하고
Application Type은 Desktop application을 선택하시고 Finish를 선택합니다.

프로젝트이름-app.xml파일이 있을 껍니다. 이거를 보게 되면 xml로 되어있는데요.
<initialWindow>
      ...
    <systemChrome>none</systemChrome>
이놈이 주석처리 되어있는데 none을 바꿔주고 주석을 풀어봅시다!

그리고 프로젝트이름.mxml파일을 열어서 vbox에 button을 하나 추가해봅시다.
[code]<mx:VBox>
  <mx:Button label="버튼" />
</mx:VBox>
[/code]
한번 실행해봅시다.

사용자 삽입 이미지
기존의 윈도우는 사라지기는 했습니다만.... 뭔가 또다른 윈도우가 생겼네요--;

저것조차도 없애봅시다--;

<initialWindow>
     ....
    <visible>true</visible>

아까 xml파일의 visible을 true로 바꿔줍니다.
그리고 메인 mxml로 돌아와서 WindowedApplication으로 되어있는 가장 최상위태그를 Application으로 바꿔줍니다.
[code]<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml">

 <mx:VBox>
    <mx:Button label="버튼" />
 </mx:VBox>
</mx:Application>
[/code]
실행해봅시다.
사용자 삽입 이미지

아.....사라졌군요. 근데 닫을 수가 없군요-_-; 닫기, 최대화, 최소화 를 구현해봅시다 ^^
이 예제는 AIR개발자문서에서 제공하는 예제입니다.
[code]<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml">

 <mx:Script>
  <![CDATA[
   public function minimizeWindow():void
   {
    this.stage.nativeWindow.minimize();
   }

   public function maximizeWindow():void
   {
    this.stage.nativeWindow.maximize();
   }
   
   public function restoreWindow():void
   {
    this.stage.nativeWindow.restore();
   }
   
   public function closeWindow():void
   {
    this.stage.nativeWindow.close();
   }
  ]]>
 </mx:Script>
 <mx:VBox>
  <mx:Button label="Minimize" click="minimizeWindow()"/>
  <mx:Button label="Restore" click="restoreWindow()"/>
  <mx:Button label="Maximize" click="maximizeWindow()"/>
  <mx:Button label="Close" click="closeWindow()"/>
 </mx:VBox>

</mx:Application>
[/code]
stage라는 놈이 최상위에 있느 놈 같은데 거기에서 nativeWindow라 하면 그 자신의 윈도우를 말하는건가요?-_-;
아....잘모르겠네. 어쨌든 저 nativeWindow라는 객체가 그 해당윈도우를 말하는 것 같습니다.
그 객체의 close, maxmize, minimize등의 메소드를 실행하니 해당윈도우가 작동을 하니 ^^

 
Posted by 머드초보

댓글을 달아 주세요