블로그 이미지
내게 능력 주시는 자 안에서 내가 모든것을 할수 있느니라 - 빌립보서 4 : 13 - happydong

카테고리

Happydong (1363)
프로그래밍 (156)
MUSIC (16)
인물 (3)
Utility (10)
세미나 소식&내용 (22)
IT뉴스 (18)
운동 (830)
CAFE (10)
Life (282)
Total
Today
Yesterday

'프로그래밍'에 해당되는 글 156건

  1. 2007.12.11 [Silverlight Game] 같은 그림찾기~! 2
  2. 2007.12.05 AJAX 방명록 만들기[9]
  3. 2007.12.04 [번역] 새로운 실버라이트 2.0 업데이트 소식 2



ㅁ Silverlight 게임 "같은 그림 찾기"

아하~초보인 제가 드뎌 Sliverlight를 이용한 게임을 만들어 봤습니다.
정말 몇일동안 삽질에 연속이었지요.. 하지만 이렇게 결과를 보니깐...넘 기쁘고 흥분을 가라안 출수가 없네요..ㅋㅋ
모.. 그리 대단한것도 아닌데..하시는 분들도 있으시겠지만...저 같은 머리로....이렇게 만들기란 정말 쉽지 않았습니다~^^;;;;에~구ㅋ
자~ 그럼 어떻게 동작하는지 아래그림들을 보면서 알아 보도록 하겠습니다.^^
아하~이름만 읽고도 알수 있겠지만....작성자의 성의를 봐서 한번 읽어주세요~ㅋ
(감사 -.- _._ -.- (꾸벅))

1. 그림

사용자 삽입 이미지


위 그림은 "같은 그림 찾기" 메인 모습입니다. 처음 들어 오시면 이미지들이 다운로드 되고 있기때문에 성격이 급하신 분들은...
잠시 기다려주는 센스 잊지 마세요~^^;;ㅋ
정말 디자인이 단순하지 않습니다. 누가 디자인을 해준것이 아니기 때문에...
제가 직접하다 보니깐..이렇게 됐네요...ㅋㅋ초등학교때는 미술 잘했는데....ㅋㅋ
아무튼 여기서 "START"를 클릭하면 게임이 시작이 됩니다.

2. 그림

사용자 삽입 이미지


3. 그림

사용자 삽입 이미지

위 그림 2,3은 START를 클릭하면 이미지들이 보여지면서 빙글빙글 돌아 갑니다. 그때 이미지들의 위치를 기억해야 겠지요~^^
그럼 시간이 되면 아래 그림처럼 이미지들이 안보이게 되고 시간이 흘러 가게 됩니다.

4.그림

사용자 삽입 이미지

시간이 흐러가고 있네요...그리고 마우스로 하나씩 클릭하면 위 그림과 같이 보여지게 되며, 같은 그림이 아닐 경우에는 다시 제 자리로 들어 가게 됩니다. 같은 그림일 경우에는 아래 그림과 같이 사라지게 되겠지요^^


5. 그림

사용자 삽입 이미지

모든 그림을 다 찾으셨다면 메세지창으로 게임 종료된 시간이 나타나게 됩니다.
아래 그림처럼요.

6. 그림

사용자 삽입 이미지


여기까지가 "같은그림찾기" 스토리보드였습니다~^^
정말 다른 사람이 만들었으면 금방 만들었을 텐데... 저는 머리가 그리 좋게 아니라서리....
엄청난 삽질에 연속이었습니다. 이제 "같은 그림찾기" 게임 만들기 강좌를 올리려고 합니다.
코드가 정리되는 대로 소스코드와 강좌를 올리도록 하겠습니다. 지금 마구 짜는 바람에.....코드가 좀 정신이 없습니다. 마치 제 머리처럼 말이지요~ㅋㅋ아무튼 기대해 주세요~^^

혹시 게임을 직접해 보고 싶으시면 아래 주소로 들어 오시면 될겁니다.
해보시고 에러사항이나 추가 사항 있으시면 덧글 부탁 드립니다~^^

게임 해보기
(위 주소는 임시 테스트로 돌리는 거라서... 언제 닫을지는 장담 못합니다~^^;;;;;)

Posted by happydong
, |



 AJAX 방명록 만들기[9]

이번에는 글을 삭제할 수 있는 삭제버튼을 구현해 보도록 하겠습니다. 제가 만든 Ajax 방명록에는 따로 수정버튼이 있지는 않기때문에 글을 쓰다가 잘 못쓰면 그냥 삭제하고 다시 써야 합니다. 조금 불편하겠네요^^;; 하지만 지금까지 만들었던 내용을 잘 생각해 보시면 수정부분 구현은그리 어렵지 않을 것 이라 생각이 되는 군요~ 그 부분은 숙제로 남기도록 하고요~ㅋ(너무 검방진말투...죄송 ^^;;) 삭제 버튼에 관해서 코드를 하나하나 보도록 하겠습니다. 먼저 아래 그림을 보시면 삭제 버튼이 어디에 붙은 녀석인지 알수 있을 것입니다.

1. 그림

사용자 삽입 이미지

그리고 삭제 버튼을 클릭하게 되면 비밀번호를 입력 할 수 있도록 메세지창 처럼 나타나게 됩니다. 아래 그림과 같이 말이죠.

2. 그림

사용자 삽입 이미지


메세지창이 나타나면 글을 입력했을 때 비밀번호를 입력 하고 삭제를 클릭하면 삭제가 되는 겁니다. 자 이제 본격적으로 코드를 보도록 하겠습니다.  먼저~! aspx 페이지의 구성된 코드를 보도록 하겠습니다.  

 .aspx페이지

//삭제 취소

function cancel()

{

document.getElementById("<%= delete_table.ClientID%>").style.display = "none";

document.getElementById("<%= User_PassWord.ClientID %>").value = "";

}

//삭제 버튼을 클릭함.

function content_Delete(seq)

{

document.getElementById("<%= b_seq.ClientID %>").value = seq;

document.getElementById("<%= delete_table.ClientID%>").style.display = "block";

}

 

<asp:HiddenField ID="b_seq" runat="server" />

 

<%-- ################### 방명록 리스트 시작 ###################### --%>

<asp:DataList ID="DataList1" runat="server" OnItemDataBound="DataList_databound">

<HeaderTemplate>

 

중간 생략

 

</HeaderTemplate>

<ItemTemplate>

 

중간 생략

 

<img alt="" style="cursor: pointer;" src="images/btn/imgDel.gif" id="Imgbtn_Delete"

onclick="content_Delete('<%# Eval("b_seq")%>')" />

</ItemTemplate>

</asp:DataList>

<%-- ############## 방명록 리스트 끝 ############################## --%>

 

<%-- ############### 삭제 관련 창 시작 작업중.. ################### --%>

<asp:Panel ID="pnl_delete" runat="server" Style="position: absolute; top: 300px; left: 500px;">

<table id="delete_table" style="display: none; background-color: #959695" cellspacing="0"

cellpadding="0" width="400" border="0" runat="server">

<tbody>

<tr style="height: 30px" valign="middle">

<td style="font-size: 11pt; width: 100%; color: white" id="tdHeader" align="center"

colspan="3" runat="server">

경고 &gt; 삭제 관련

</td>

</tr>

<tr style="height: 50px" valign="middle">

<td style="width: 1%; height: 50px">

</td>

<td style="width: 98%; height: 50px; background-color: white" align="center">

삭제하시려면 비밀번호를 입력해주세요^^< br />

비밀 번호 :&nbsp;<asp:TextBox ID="User_PassWord" runat="server" TextMode="Password"></asp:TextBox>

</td>

<td style="width: 1%; height: 50px">

</td>

</tr>

<tr style="height: 2px" valign="middle">

<td style="width: 100%" align="center" colspan="3">

</td>

</tr>

<tr style="height: 2px" valign="middle">

<td style="width: 100%" align="center" colspan="3"></td>

</tr>

<tr style="height: 30px" valign="middle">

<td style="width: 1%">

</td>

<td style="width: 98%; background-color: white" align="center">

<asp:Button ID="btn_OK" runat="server" Text="삭제" OnClick="content_Deldete" />

<input type="button" value="취소" onclick="cancel()" />

</td>

<td style="width: 1%">

</td>

</tr>

<tr style="height: 2px" valign="middle">

<td style="width: 100%" align="center" colspan="3">

</td>

</tr>

</tbody>

</table>

</asp:Panel>

<cc1:dragpanelextender id="DragPanelExtender2" runat="server" draghandleid="pnl_delete"

targetcontrolid="pnl_delete">

</cc1:dragpanelextender>

<%-- ########################## 삭제 관련 창 끝 ########### --%>


위 코드에서 중간 생략 부분은 AJAX 방명록 만들기[8] 부분에 자세하게 코드가 나와 있습니다. 참고 하실분은 참고 하세요~^^ 코드에 보시면 DataList 컨트롤에 ItemTemplate 안에 img태그가 있습니다. img 태그는 onclick Event를 가지고 있는 것을 볼 수 있습니다. 그럼 이벤트가 호출하는 JavaScript 함수에 대해 알아 보도록 하지요~! 음..인자 값으로 바인딩된 해당글의 번호를 받고 있습니다. 그리고 b_seq 라는 id를 가진 HiddenField 에 value 값으로 설정해 주고 있습니다. 그 다음에 메세지창의 tablestyle 속성인 display block로 설정해주고 있습니다. (메세지창의 table의 display 기본설정은 none 입니다) 이렇게 간단한 style 속성을 이용해서 기본적으로 페이지에는  존재하고 있지만 눈에 보이지 않고, 특정 이벤트가 일어날때 보이는 아주 간단한 구조 입니다.^^;;;; 이제 메세지창이 나타났겠군요~! 이 메세지창에서 삭제를 취소 하려고 버튼을 누루면 위에 JavaScript함수인 cancel함수가 호출이 됩니다. cancel 함수는 위 내용을 잘 읽으셨다면 이해하시리라 생각이 됩니다.^^;; 삭제를 진행하시려면 Textbox에 비밀번호를 입력하고 확인을 클릭하면 됩니다. 이때 일어나는 일들에 대해 알아 보도록 하겠습니다.  위 코드에서 보시면... btn_OK 라는 id를 가진 Button이 하나 있는 것을 볼 수 있을 것입니다. 한번 버튼 이벤트(content_Deldete)대해 알아 보도록 하겠습니다. 아래 코드는 비하인트 코드 부분입니다.

 Guest_Board.aspx.cs페이지

protected void content_Deldete(object sender, EventArgs e)

{

delete_table.Style.Add("display", "none");

bclass.u_pass = this.User_PassWord.Text;

bclass.b_Seq = int.Parse(this.b_seq.Value);

bclass.Procedure(4);

if (bclass.pass_count != 1)

ScriptManager.RegisterStartupScript(this, this.GetType(), "testeste", "alert('비밀번호가 틀렸습니다!!')", true);

else

ScriptManager.RegisterStartupScript(this, this.GetType(), "Text", "alert('정상적으로 삭제되었습니다!!')", true);

ListBind();

}

처음으로 delete_table(메세지창의 table)의 Style 속성을 변경해 주고 있습니다. 비밀보호를 입력하고 나서는 메세지창이 계속 보여질 필요가 없으므로 않보이도록 했습니다. 그리고 bclass에 property를 이용해서 사용자가 입력한 비밀 번호화 해당글의 번호를 넘기고 있습니다. 삭제 하기 위해서는 필요한값들이지요~^^;; 아래는 property 코드 입니다.

 boardClass.cs페이지

private int seq;

private string U_Pass;


public string u_pass

{

        get { return U_Pass; }

        set { U_Pass = value; }

}

public int b_Seq

{

        set { seq = value; }

}


이렇게 값을 넣겨주고 나서는 bclass(boardclass)의 Procedure메소드를 호출하고 있습니다.이부분은AJAX 방명록 만들기 거의 모든 부분에서 다루었던 코드이므로 따로 설명 하지 않도록 하겠습니다~^^;; 인자 값으로 4를 넘기고 있습니다. 해당 코드는 아래와 같습니다~^^

 boardClass.cs페이지 

public void Procedure(int num)

{

 

중간 생략

 

else if (num == 4)

{

query = "gb_password";

Db_Parameters(false);

Count = dcon.GetCheck(query);

if (Count != 0)

{

dcon.Comm.Parameters.RemoveAt(0);

query = "gb_Delete";

dcon.ExecuteNon(query);

}

}

}


gb_password
라는 프로시져를 query의 값으로 설정하고 있네요~
프로시져 내용은 아래와 같습니다.

gb_password Procedure

 create proc gb_password

(

@b_seq int,

@b_pass varchar(20)

)

as

select count(*) from guest_board where b_seq = @b_seq and b_pass = @b_pass

 

GO


그리고 나서 Db_Parameters 메소드를 호출하고 있습니다. 인자값으로는 bool 값을 넣겨 주고 있네요. Db_Parameters메소드는 AJAX 방명록 만들기[7] 부분에서도 다루었던 내용 입니다. 간단하게 설명하자면 받은 인자 값으로 해당 조건을 확인하고, 해당 프로지셔의 Parameter를 만듭니다.(Db_Parameters메소드의 자세한 코드는 AJAX 방명록 만들기[7]를 참고 해주세요)
그 다음 코드는 dbclassGetCheck 메소드를 호출하고 있습니다. 인자값으로 프로지져를 넘기고 있네요. 코드 쓰임새를 보아하니 return 값이 있는 메소드인듯 합니다. GetCheck메소드는 AJAX 방명록 만들기[8] 에서 다루었던 내용입니다. 삭제부분에서쓰여진 목적은 해당 글번호에 있는 비밀번호가 일치하는 게있는지 확인하기 위함 입니다. 일치하는 내용이 있다면 return 값이 1 이고 아니면 0 이 겠지요~^^; (GetCheck메소드의 자세한 코드는AJAX 방명록 만들기[8] 를 참고 해주세요~^^) 조건문을 확인해 보면 0이 아니라면 이니깐...1이면 삭제가 된다는 의미겠군요^^;;그럼 자시 query를 만들고 Parameter를 만들어야 하겠군요~! 프로시져는 아래와 같습니다.

gb_Delete Procedure

 create proc gb_Delete

(

        @b_seq int

)

as

delete from guest_board where b_seq = @b_seq

 

GO


Parameter는 해당 글 번호 하나만 만들면 되겠군요~^^ 하지만 위에서 비밀번호와 해당글번호에 관련된 Parameter를 만들어 두었지 않습니까~!그럼 필요없는 비밀번호 Parameter만 없애 주면 되겠군요~그래서 RemoveAt메소드를 이용했습니다. 0번째를 지우는 거지요. 아까 비밀번호파라미터를 만들고 나서 글 번호 파라미터를 만들었기 때문에 0번째를 지우면 되겠지요.이렇게 지우고나서 dbclassExecuteNon 메소드를 호출합니다. ExecuteNon메소드AJAX 방명록 만들기[7] 에서 다루었던 내용 입니다. 간단하게 설명하자면 ExecuteNonQuery메소드를 호출하도록 정의한 메소드 입니다. 이렇게 하면 데이터베이스에서 삭제가 일어 나겠군요~^^ 자 다시 이벤트 부분 코드로 돌아 와서...ㅋㅋ조건문이 하나 있군요~ 보아하니 bclass에서 property를 이용해서 Count값을 가지고와서 그 값이 1 이 맞는지 확인하는 것 같습니다. 맞습니다~! 확인하는 것입니다. 그래서RegisterStartupScript메소드를 통해서 Alert창을 뛰우는 것이지요. 그리고 나서 삭제도 되었으니깐 리스트부분을 다시 바인딩해야 하지 않겠습니까..그래서 코드 마지막에 ListBind()메소드를 호출하도록 했습니다. (ListBind 메소드는 AJAX 방명록 만들기[8]를 참고하세요~^^)
여기까지 제가 만들고자했던 AJAX 방명록이 다 만들어 졌습니다. 초보인 저 또한 이렇게 Ajax Control Toolkit를 이용해서 Ajax 방명록을 만들수 있을 알려드리려고 했는데... 도움이 되셨는지 모르겠습니다. 다소 제 설명이 너무나 미흠해서 이해가 않가실수도 있고...또는 애가 무슨소리하는거야...하는 생각이 들으 셨다면 죄송합니다. 그리고 제가 쓴 내용중에 제가 잘 못 알고 있는 부분이 있다면 서슴없이 따끔한 한마디 부탁드립니다~^^

제가 만든 소스도 올려 놓도록 하겠습니다. 혹시 소스를 보고 잘못된 부분이나 에러 같은 게있다면 말씀해 주세요~^^부족한 저에게 힘이 되어 주세요~ㅋㅋ^^
아무튼 지금까지 제가 나름 쓴 강좌를 읽어 주셔서 감솨합니다~

오늘 하루도 즐거고 행복한 하루되세요~^^홧팅~

Posted by happydong
, |



http://weblogs.asp.net/scottgu/archive/2007/11/29/net-web-product-roadmap-asp-net-silverlight-iis7.aspx
스캇 형님글을 HOONS의 짧은 영어로 대충 해석해 보겠습니다.

--------------------------------------------------------------------------------------

실버라이트 2.0 릴리즈

두달전 실버라이트 1.0을 윈도우와 맥에서 지원할 수 있게 오픈했고 리눅스에서도 지원되도록 하려는 계획을 가지고 있었다. 이 1.0은 자바스크립트와 Ajax를 이용하는 프로그래밍 모델이었다.

내년에 우리는 실버라이트를 RIA에 초점을 두어 정말 큰 업데이트가 있을 것이다. 여기서는 크로스 플랫폼과 크로스 브라우저를 완벽하게 지원하는 프레임워크를 탑재할 것이다. 더 일찍 알파 버전에서 이미 닷넷을 이용한 기능을 보여주긴했었다. 우리의 다음 모델의 주요한 기능은 다음과 같다.

1. WPF UI 프레임워크
현재 실버라이이트 알파는 아주 기본적인 컨트롤들만 지원하고 있다. 다음 실버라이트에서는 고수준의 WPF UI 프레임워크를 포함시킬 것이다. 주요한 기능은 다음과 같이 정리할 수 있다.
->확장이 가능한 프레임워크 모델, 레이아웃 관리자 지원, 두가지 방법의 데이터 바인딩 지원 컨트롤 템플릿과 스킨 지원
실버라이트에 탑재되는 WPF UI 프레임워크는 지난주에 업데이트된 닷넷 프레임워크 3.5에서 확인해 볼 수 있을 것이다.


2. Rich Controls
실버라이트는 RIA 를 아주 쉽게 구축할 수 있는 컨트롤들이 대거 추가될 것이다. 다음 실버라이트 릴리즈(2.0)에서는 Textbox, CheckBox, RadioButton 등등의 많은 컨트롤들이 지원될 것이고 StackPanel,Grid 와 같은 레이아웃컨트롤 들이 지원될 것이다. 뿐만 아니라 TabControl, Slider, ScrollViewer, ProgressBar 컨트롤들 그리고 DataGrid와 같은 데이터 바인딩 컨트롤을 지원할 것이다.

3. Rich Networking 지원
실버라이트는 향후에 Rich 네트워크를 지원할 것이다.(역주:Rich 네트워크는뭘까? 크로스 도메인 지원인가?) 새롭게 발표될 실버라이트는 REST,POX,RSS와 WS*와 같은 통신을 지원할 것이고 또한 크로스 도메인도 지원할 예정이다.

4. Rich Base Class Library
실버라이트는 rich .NET 기반의 클래스 라이브러리를 추가할 것이다.(collections, IO, generics, threading, globalization, XML, local storage, 등등) 다음 실버라이트는 또한 XML을 위한 LINQ의 지원을 추가할 것이고 더 풍부한 HTML DOM API를 지원할 것이다.

이전에 닷넷 기반의 실버라이트를 "Silverlight 1.1"로 불렀었다. 후에 우리는 새로운 기능을 추가할 것이고 그 이름을 "실버라이트 2.0" 으로 부르기로 결정하였다. 우리는 실버라이트2.0 베타를 2008년도 1사분기에 내놓을 예정이다. 이 베타는 Go-Live 라이센스를 가지고 있기 때문에 개발자들이 먼저 개발하고 실버라이트 2.0 어플리케이션을 배포가 가능하다.

우리는 또한 무료로 비주얼 스튜디오 2008을 업데이트 할 것이다. 업데이트는 당연히 실버라이트 2.0 툴을 지원할 수 있는 업데이트가 될 것이고 개발자들은 닷넷 언어를 이용하여 아주 쉽게 실버라이트 어플리케이션 만들수 있을 것이다. 그리고 우리는 실버라이트를 개발하기 위해서 비주얼 스튜디오 2008 Standard/Professional  둘다 지원할 예정이고 뿐만아니라 무료 툴인 비주얼 스튜디오 2008 Express 에디션 버전도 지원할 예정이다.

필자는 실버라이트 2.0에 대한 새로운 블로그 튜토리얼 시리즈를 몇주에 거쳐서 게시할 예정이고 더 세부적인 내용들을 보여줄 것이다. 자세한 내용을 가지고 다시 올테니깐 그 때 보자고 안녕~

--------------------------------------------------------------------------------------

원문은 다음과 같습니다.

Silverlight 2.0 Release

Two months ago we shipped Silverlight 1.0 for Mac and Windows, and announced our plans to deliver Silverlight on Linux.  Silverlight 1.0 is focused on enabling rich media scenarios in a browser, and supports a JavaScript/AJAX programming model.

Next year we will be releasing a major update of Silverlight that focuses on enabling rich Internet applications.  This release will include a cross-platform, cross-browser version of the .NET Framework, and will enable a rich .NET development platform in the browser.  Earlier this year we shipped an early Alpha containing some of the basic functionality of the release.  Our next public preview will add considerably to this feature set.  Some of the new .NET specific features in the next public Silverlight preview will include:

  • WPF UI Framework: The current Silverlight Alpha release only includes basic controls support and a managed API for UI drawing.  The next public Silverlight preview will add support for the higher level features of the WPF UI framework.  These include: the extensible control framework model, layout manager support, two-way data-binding support, and control template and skinning support.  The WPF UI Framework features in Silverlight will be a compatible subset of the WPF UI Framework features in last week's .NET Framework 3.5 release.

  • Rich Controls: Silverlight will deliver a rich set of controls that make building Rich Internet Applications much easier.  The next Silverlight preview release will add support for core form controls (textbox, checkbox, radiobutton, etc), built-in layout management controls (StackPanel, Grid, etc), common functionality controls (TabControl, Slider, ScrollViewer, ProgressBar, etc) and data manipulation controls (DataGrid, etc).

  • Rich Networking Support: Silverlight will deliver rich networking support.  The next Silverlight preview release will add support for REST, POX, RSS, and WS* communication.  It will also add support for cross domain network access (so that Silverlight clients can access resources and data from any trusted source on the web).

  • Rich Base Class Library Support: Silverlight will include a rich .NET base class library of functionality (collections, IO, generics, threading, globalization, XML, local storage, etc).  The next Silverlight preview release will also add built-in support for LINQ to XML and richer HTML DOM API integration.

Previously we've been referring to this .NET-enabled Silverlight release as "Silverlight V1.1".  After stepping back and looking at all the new features in it (the above list is only a subset - there are many more we aren't sharing yet), we've realized that calling it a point release doesn't really reflect the true nature of it.  Consequently we have decided to change the name and refer to it as "Silverlight V2.0" going forward.

We will be releasing a Beta of Silverlight 2.0 in Q1 of 2008.  This Beta will support a Go-Live license that enables developers to begin building and deploying Silverlight 2.0 applications.

We will also be releasing a free Visual Studio 2008 tools update that provides great Silverlight 2.0 tools support within Visual Studio 2008, and enables developers to easily build Silverlight applications using any .NET language.  We will be supporting Silverlight development with both the Visual Studio 2008 Standard/Professional products, as well as with the free Visual Studio 2008 Express editions.

I'm going to be starting a new blog tutorial series in a few weeks that discusses how to build Silverlight 2.0 applications, and show off the new features in more depth.  Stay tuned for more details soon.


 - 출처 : http://www.hoons.kr -

Posted by happydong
, |