Search results for '분류 전체보기'

  1. 2015.06.26 -- [하이브리드 앱 개발] 웹페이지에서 델파이 함수 호출하기
  2. 2015.06.25 -- TWebbrowser의 "tel:, sms:" 링크가 동작하지 않는 이슈 해결방법
  3. 2015.06.25 -- 델파이 프레임워크(VCL/FMX) 소스코드를 직접 수정하는 방법
  4. 2015.06.24 -- [윈도우10] 델파이로 윈도우10 알림 표시하기(WinRT API 이용)
  5. 2015.06.09 -- 개발환경 설정 - 안드로이드 개발환경
  6. 2015.06.04 -- RAD Studio MidaConverter로 VCL 프로젝트를 FMX 프로젝트로 변환하기
  7. 2015.06.04 -- 앱의 상태바(StatusBar) 제어하기(색상변경, 감추기, 투명하게)
  8. 2015.06.04 -- [XE8] 스피드버튼의 이미지를 크게 표시할 수 있습니다.
  9. 2015.05.28 -- [XE8] RAD Studio XE8을 지원하는 외부 컴포넌트와 도구
  10. 2015.05.27 -- JVCL(JCL) 써드파티 컴포넌트 최신버전을 받기
  11. 2015.05.27 -- 블로그를 해킹당해 복구 중입니다.
  12. 2015.05.26 -- RAD Studio XE8로 윈도우 10 애플리케이션 만들기
  13. 2015.05.19 -- [XE8] 애플리케이션 외관을 멋지고 일관되게 적용할 수 있는 프리미엄 스타일(Radiant, Vapor 추가)
  14. 2015.05.18 -- [JVESoft] 광고와 결재 컴포넌트(AdMob, Paypal 등)
  15. 2015.05.18 -- [iOS] 배포파일 아이클라우드 백업 옵션설정하기
  16. 2015.04.27 -- [XE8] 번거로운 수작업을 줄여 핵심기능 개발에 집중할 수 있는 개발 생산성 향상도구
  17. 2015.04.27 -- [XE8] TAppAnalytics 컴포넌트로 앱의 사용량 수집, 분석해 사용성을 이해할 수 있습니다.
  18. 2015.04.17 -- [XE8] 오프라인에서 도움말을 볼 수 있습니다.(CHM 형식)
  19. 2015.04.17 -- [XE8] 대화형 지도 컴포넌트로 구글맵과 애플 맵킷 한번에 사용하기
  20. 2015.04.16 -- [XE8] 멀티-디바이스 미리보기: 다양한 디바이스 화면을 미리보며 최적화된 화면 개발하기

[하이브리드 앱 개발] 웹페이지에서 델파이 함수 호출하기

2015. 6. 26. 14:00

델파이는 성능좋은 네이티브 모바일 앱을 개발할 수 있는 개발 도구입니다.

모든 기능을 네이티브로 개발할 수 있지만, 이미 반응형 웹페이지를 갖고 있는 경우 일부 기능을 웹브라우를 통해 구현해 하이브리드 형태로 개발 할 수 있습니다.


이 경우 델파이 코드에서 웹페이지의 자바스크립트를 호출하는 방법은 웹브라우저에서 제공하는 메소드(EvaluateJavaScript)를 사용할 수 있지만, 반대로 웹브라우저에서 델파이 코드를 호출하는 방법은 잘 모르실 것 같아 샘플을 만들어 공개합니다.


이글에서는 다음 기능을 소개합니다.

  • 델파이 코드로 웹브라우저의 자바스크립트 코드 호출하기
  • 웹브라우저에서 델파이 메소드 호출하기(파라메터 포함)


기본 구성

❑ 웹페이지 구성

웹페이지(http://hjf.pe.kr/fmx/hybrid.php)의 자바스크립트 코드는 다음과 같습니다.

웹페이지에서 델파이 코드 호출은 아래와 같이 2개의 버튼으로 처리합니다..

	

❑ 델파이 앱 화면 구성


델파이에서 자바스크립트 호출하기

델파이에서 웹브라우저 안의 자바스크립트 호출은 EvaluateJavaScript 메소드를 이용합니다. 자바스크립트 함수 뿐 아니라 여러줄의 구문도 실행할 수 있습니다.

델파이 코드

델파이에서 자바스크립트의 callJSMethodFromDelphi 함수 실행

procedure TForm1.Button1Click(Sender: TObject);
begin
  WebBrowser1.EvaluateJavaScript('callJSMethodFromDelphi();');
end;

웹페이지의 자바스크립트 코드

자바스크립트는 다음과 같이 메시지 다이얼로그를 출력하도록 되어있습니다.

function callJSMethodFromDelphi(){
	alert("[JS] Call from delphi");
}

테스트 결과

EvaluateJavaScript 메소드 자세히 보기(웹브라우저 html 코드를 적용할 수 있는 LoadFromStrings 메소드도 활용도가 높습니다.)

웹페이지에서 델파이 메소드 호출하기

웹페이지에서 델파이 메소드를 호출하는 원리는 아래와 같습니다.

  1. 델파이는 웹브라우저 주소가 변경되면 이벤트를 받을 수 있다.
  2. 웹페이지에서 웹브라우저 주소를 변경할 수 있다.
  3. 웹페이지에서 주소를 http:// 형태의 페이지 주소가 아닌, 델파이 메소드를 호출하라는 사용자 포맷의 주소를 호출한다.
  4. 델파이에서 주소 변경 이벤트 발생 시 사용자포맷 주소인 경우, 주소를 분석 해 델파이 메소드를 호출한다.

❑ 델파이 파이어몽키용 웹브라우저 주소 변경 이벤트 종류

웹브라우저(TWebBrowser)의 주소변경 이벤트는 다음과 같습니다.

이벤트

 발생 조건

 OnDidFailLoadWithError

  페이지 로드 중 에러가 난 경우 발생

 OnDidFinishLoad

  페이지 로드가 완료한 경우 발생
 OnDisStartLoad  페이지 로드를 시작할때 발생
 OnShouldStartLoadWithRequest

  요청에 의해 페이지 로드를 시작할때 발생


이 데모에서는 페이지 로드 요청 시 발생하는 OnShouldStartLoadWithRequest 이벤트를 이용합니다.

(메소드 호출과정에 페이지가 로드되지 않기 때문에 OnDisStartLoad 이벤트는 발생하지 않습니다.)


❑ 웹페이지에서 델파이 메소드 호출하기

웹페이지에서 델파이 메소드 호출은 아래 자바스크립트를 호출해 동작합니다.

function callDelphiMethodFromJS(){
	window.location = "jscall://callDelphiMethodFromJS";
}

function callDelphiMethodFromJSWithParam(){
	window.location = "jscall://callDelphiMethodFromJSWithParam?Hello|1234";
}


위 자바스크립트 코드는 웹페이지 주소(window.location)를 변경하는 코드로, 사용자 포맷(jscall://)으로 주소를 변경합니다.


제가 정의한 포맷은 다음과 같습니다.(임의로 정한 규칙임으로 원하는 방식으로 정의해서 사용하기 바랍니다.)

 포맷 정의

용도 

 jscall:// 

 델파이 코드를 호출하는 주소라는 의미

 callDelphiMethodFromJSWithParam

 호출할 델파이 코드명

 ?Hello|1234

 "?" 뒤에는 파라메터를 추가합니다. 파라메터는 파이프("|")로 구분합니다.


다음으로 웹페이지에서 위 포맷으로 주소 변경 시, 델파이에서 감지해 메소드를 호출하도록 구현합니다.

❑ 델파이에서 사용자 포맷 주소 감지하고 분석하기

델파이 웹브라우저 OnShouldStartLoadWithRequest 이벤트에는 아래와 같이 구현했습니다.

procedure TForm1.WebBrowser1ShouldStartLoadWithRequest(ASender: TObject;
  const URL: string);
var
  MethodName: string;
  Params: TArray;
begin
  if ProcessMethodUrlParse(URL, MethodName, Params) then
  begin
    CallMethod(MethodName, Params);
  end;
end;


ProcessmethodUrlParse 메소드로 URL을 분석하고, 메소드 URL인 경우 메소드를 호출하는 CallMethod를 호출합니다.

메소드 URL 분석

// URL format
//  jscall://{method name}?{Param1}|{ParamN}
//  e.g> jscall://callDelphiMethodFromJSWithParam?Hello|1234
function TForm1.ProcessMethodUrlParse(AUrl: string;
  var MethodName: string; var Parameters: TArray<TValue>): Boolean;
const
  JSCALL_PREFIX = 'jscall://';
  JSCALL_PREFIX_LEN = Length(JSCALL_PREFIX);
var
  I: Integer;
  ParamStr: string;
  ParamArray: TArray;
begin
  Result := False;

  // iOS에서 특수기호(|)가 멀티바이트로 넘어옴
  AUrl := TNetEncoding.URL.Decode(AUrl);

  if AUrl.IndexOf(JSCALL_PREFIX) = -1 then
    Exit(False);

  if AUrl.IndexOf('?') > 0 then
  begin
    MethodName := AUrl.Substring(JSCALL_PREFIX_LEN, AUrl.IndexOf('?')-JSCALL_PREFIX_LEN);

    ParamStr := AUrl.Substring(AUrl.IndexOf('?')+1, Length(AUrl));
    ParamArray := ParamStr.Split(['|']);
    SetLength(Parameters, length(ParamArray));
    for I := 0 to Length(ParamArray)-1 do
      Parameters[I] := ParamArray[I];
  end
  else
    MethodName := AUrl.Substring(JSCALL_PREFIX_LEN, MaxInt);
  if MethodName.IndexOf('/') > 0 then
    MethodName := MethodName.Replace('/', '');

  Result := not MethodName.IsEmpty;
end;

❑ 분석한 메소드 호출

웹페이지에서 호출할 델파이 메소드는 아래와 같이 자바스크립트와 동일한 이름으로 작성했습니다.

procedure TForm1.callDelphiMethodFromJS;
begin
  ShowMessage('[DELPHI] Call from JS');
end;

procedure TForm1.callDelphiMethodFromJSWithParam(AStr1, AStr2: string);
begin
  ShowMessage(Format('[DELPHI] Call from JS(%s, %s)', [AStr1, AStr2]));
end;

텍스트 타입의 메소드이름으로 메소드를 호출하는 방법은 간단하게 조건문으로 호출하는 방법도 있고, RTTI를 이용해 메소드이름으로 메소드를 찾아 호출하는 방법으로도 구현할 수 있습니다.

조건문으로 메소드 호출

function TForm1.CallMethod(AMethodName: string; AParameters: TArray<TValue>): TValue;
begin
  if AMethodName = 'callDelphiMethodFromJS' then
    callDelphiMethodFromJS
  else if AMethodName = 'callDelphiMethodFromJSWithParam' then
    callDelphiMethodFromJSWithParam(AParameters[0].AsString, AParameters[1].AsString);
end;


RTTI를 이용해 메소드 호출

function TForm1.CallMethod(AMethodName: string; AParameters: TArray<TValue>): TValue;
var
  RttiCtx: TRttiContext;
  RttiTyp: TRttiType;
  RttiMtd: TRttiMethod;
begin
  RttiCtx := TRttiContext.Create;
  RttiTyp := RttiCtx.GetType(Self.ClassInfo);
  if Assigned(RttiTyp) then
  begin
    RttiMtd := RttiTyp.GetMethod(AMethodName);
    if Assigned(RttiMtd) then
      Result := RttiMtd.Invoke(Self, AParameters);
  end;
  RttiMtd.Free;
  RttiTyp.Free;
  RttiCtx.Free;
end;

테스트 결과



<주의>

안드로이드 앱의 웹브라우저에서 델파이 코드 호출 시 ERR_UNKNOWN_URL_SCHEME 오류가 발생하는 경우 다음 글을 참고해 조치하기 바랍니다.


 - http://blog.hjf.pe.kr/378


샘플 다운로드

다운로드 : 

HybridAppDemoSrc.zip



험프리 험프리.김현수 파이어몽키

TWebbrowser의 "tel:, sms:" 링크가 동작하지 않는 이슈 해결방법

2015. 6. 25. 19:31

델파이로 하이브리드 앱 개발 시 안드로이드 환경에서 전화걸기 링크(tel:)를 클릭하면 웹페이지 오류(ERR_UNKNOWN_URL_SCHEME)가 표시됩니다.

원래는 전화걸기 기능이 실행되야 합니다.


이 글은 안드로이드 하이브리드 앱에서 웹브라우저(TWebBrowser)의 전화걸기, 문자전송 등의 링크 클릭 시 해당 기능이 동작하도록 처리하는 방법을 안내합니다.


먼저 웹페이지의 구성과 증상을 살펴봅니다.

웹페이지 구성과 증상

웹페이지(http://hjf.pe.kr/fmx/hybrid.php)에는 아래와 같이 전화걸기, 문자전송, 메일 전송 링크를 제공합니다.

	[Phone number]  / 
	[Send sms]  / 
	[Send mail]


위 페이지를 안드로이드 앱의 웹브라우저에 표시하고, 전화걸기 링크를 클릭하면 다음과 같이 웹 페이지 오류가 표시됩니다.

위 오류가 발생하는 원인은 링크를 클릭하면 관련 액티비티가 처리해야 하는데 웹페이지로 인식해 웹브라우저가 분석하는데 실패하기 때문입니다.

그럼 링크 클릭 시 페이지 이동 대신 기능 액티비티를 표시하도록 수정해보니다.

파이어몽키 안드로이드 웹브라우저 소스 수정

위 링크 이슈를 해결하기 위해서는 파이어몽키 안드로이드 웹브라우저의 소스(FMX.WebBrowser.Android.pas)를 수정 해야합니다.(아래 과정은 델파이 XE8 기준으로 설명합니다. 다른 버전은 소스의 경로와 소스코드 내용 중 일부가 다를 수 있습니다.)

1, 안드로이드 소스코드 복사

아래 경로에서 안드로이드 웹브라우저 소스(FMX.WebBrowser.Android.pas)파일 복사합니다.

  • C:\Program Files (x86)\Embarcadero\Studio\16.0\source\fmx\FMX.WebBrowser.Android.pas (XE8 기준)
위 파일을 델파이 프로젝트 파일(*.dproj)과 같은 경로에 붙여넜습니다.

프로젝트 경로에 파일을 복사한 이유는 델파이 컴파일러는 프로젝트 파일의 경로의 소스파일을 우선적으로 참고해 컴파일합니다. 위 특징을 이용해 프레임워크 소스코드를 프로젝트 파일과 같은 경로에 놓고 수정하면 수정된 내용이 적용되어 컴파일 됩니다.


2, 파이어몽키 소스코드 수정

위에서 복사한 소스코드를 델파이 IDE > File > Open 메뉴로 엽니다.
그리고, shouldOverrideUrlLoading 메소드 구현부를 수정하겠습니다.

shouldOverrideUrlLoading 메소드는 웹뷰의 URL 변경 시 발생되며, URL에 따라 호스트 애플리케이션이 제어할 수 있는 기회를 주는 이벤트입니다.(안드로이드 기술문서: shouldOverrideUrlLoading)

리턴 값이 True이면 호스트가 제어하기 때문에 화면을 이동하지 않고, False이면 화면을 이동합니다.

다음 코드를 참고해 shouldOverrideUrlLoading 메소드 구현부를 수정합니다.

function TAndroidWebBrowserService.TWebBrowserListener.shouldOverrideUrlLoading(
  P1: JWebView; P2: JString): Boolean;
var
  Url: string;
  Intent: JIntent;
begin
  Url := JStringToString(P2);

  FWBService.ShouldStartLoading(Url);
  Result := False;

  // 리턴값이 True이면 페이지를 랜더링하지 않음
    // http 또는 https 인 경우 False(랜더링 함)
    // 그 외 True(렌더링 안함)  로딩을 중지 함(P1.stopLoading)
  if (Url.StartsWith('http://') or Url.StartsWith('https://')) then
    Result := False
  else
  begin
    // tel:, sms:, mailto:, geo: 등은 해당 Activity 실행
    Intent := TJIntent.JavaClass.init(TJIntent.JavaClass.ACTION_VIEW,
      TJnet_Uri.JavaClass.parse(P2));
    try
      SharedActivity.startActivity(Intent);
      Result := True;
    except
    end;
  end;

  // 렌더링 안하므로 로딩 중지
  if Result then
    P1.stopLoading;
end;

3, 테스트

위와 같이 수정하고 빌드 후 전화번호 링크를 클릭하면 아래와 같이 관련된 기능이 동작합니다.


참고 글



험프리 험프리.김현수 파이어몽키

델파이 프레임워크(VCL/FMX) 소스코드를 직접 수정하는 방법

2015. 6. 25. 18:23

개발을 하다보면 프레임워크가 제공하는 기능을 약간 수정하고 싶거나, 버그를 수정하고 싶은 경우가 있습니다. 아래 내용을 참고해 델파이 프레임워크 소스코드를 수정해서 사용하기 바랍니다.(VCL과 파이어몽키 모두 사용가능합니다.)

(주의 : 잘못 수정했을 경우 많은 영역에서 사이드 이펙트가 발생 할 수 있으므로, 정확히 이해한 경우에 한해 프레임워크 소스를 수정하기 바랍니다.)


만약, VCL 또는 파이어몽키 버그를 발견했다면 혼자만 수정해서 사용하지 말고 제품에 반영될 수 있도록, 엠바카데로에 레포팅해주시기 바랍니다.^^

(엠바카데로 퀄리티 포털 이용방법 안내)

델파이 프레임워크 소스 수정방법

1, 프로젝트 경로로 소스파일 복사

수정하고 싶은 소스파일(*.pas)을 프로젝트 파일(*.dproj)과 동일한 경로에 복사합니다.

소스파일은 델파이 설치경로 하위 Source 디렉토리에 있습니다.

(XE8의 경우 : C:\Program Files (x86)\Embarcadero\Studio\16.0\source)    

2, 소스코드 수정

1번에서 복사한 소스파일을 File > Open 메뉴로 열어, 수정합니다.(프로젝트에 파일을 추가해도 됩니다.)

3, 컴파일

컴파일 시 델파이는 프로젝트 파일(*.dproj)과 같은 경로의 소스코드를 제일먼저 참조하기 때문에 위에서 수정한 소스파일이 컴파일 되어 실행됩니다.(당연히 디버깅도 가능합니다.)



위의 내용으로 수정 시 해당 프로젝트에만 적용됩니다.

너무 많은 부분을 수정하면 델파이 버전 업데이트 시 고생할 수 있습니다.

험프리 험프리.김현수 Delphi/C++Builder

[윈도우10] 델파이로 윈도우10 알림 표시하기(WinRT API 이용)

2015. 6. 24. 10:35

윈도우10 알림

윈도우10 알림 기능은 윈도우10에서 새로 추가된 주요기능 중 하나입니다.

이미 모바일 기기에서 사용하던 알림영역과 같은 기능을 윈도우에서 제공한다고 보면 됩니다. 이제 윈도우에서도 앱의 상태변화 또는 새로운 소식을 알림영역 한곳에서 볼 수 있어 더욱 편리해 질 것 같습니다.


윈도우 알림이 발생하면 우측하단에 토스트 메시지가 표시가됩니다.


그리고 트래이의 알림 아이콘을 누르면 알림바가 표시되어 알림이력을 한눈에 확인할 수 있습니다.


아마 여러분들이 제작한 델파이 앱에서도 윈도우10 알림기능은 매우 유용하게 사용할 수 있는 부가기능일텐데요. 델파이에서 어떻게 사용할 수 있는지 알아봅니다.

델파이로 윈도우10 알림 표시하기

엠바카데로에서도 발빠르게 윈도우10을 지원하고 있습니다. 지난 주(6월 18일) 진행한 윈도우10 웨비나에서 윈도우10 스타일과 윈도우10의 기능을 활용하는 컴포넌트 그리고 윈도우10 알림을 표시하는 데모를 진행했습니다.


그중 마르코칸투는 윈도우RT API를 사용해 윈도우10 알림 메시지 데모를 진행 후 블로그를 통해 샘플코드를 공개했고, WinRT 라이브러리는 Getit 기능을 통해 제공했습니다.

(눈치빠르신 분들은 이미 아셨겠지만 상단의 이미지는 델파이로 만든 앱에서 윈도우10 알림을 표시한 데모입니다.)


윈도우10 알림 샘플 프로젝트는 다음 과정을 통해 진행했습니다.

윈도우10 프리뷰 버전 설치

먼저 윈도우10 운영체제를  설치합니다.(정식버전 출시 전에는 윈도우즈 인사이더 프로그램(https://insider.windows.com/)에서 프리뷰 버전을 다운로드, 설치할 수 있습니다.)

RAD Studio XE8(또는 델파이 XE8)을 설치합니다.

구입한 제품 또는 무료평가판(http://www.devgear.co.kr/products/)을 윈도우10에 설치합니다.

WinRT 라이브러리 설치

WinRT 라이브러리는 겟잇 패키지 매니저를 통해 제공합니다.

Tools > Getit Package Manager... 메뉴를 선택 후 "Delphi Windows 10 WinRT" 항목을 설치합니다.

윈도우10 알림 표시 샘플코드 다운로드하기

마르코칸투는 웨비나 데모에 사용한 샘플코드를 블로그를 통해 공개했습니다. 

아래 링크에서 소스코드 소개와 샘플코드 다운로드할 수 있습니다.

실행, 테스트

샘플을 실행 후 알림을 표시하면 토스트 메시지와 알림영역에 메시지가 표시됩니다. 그리고 메시지를 클릭하면 델파이 앱에서 인식해 "You clicked on the notification" 메시지를 폼에 출력합니다.


현재는 데모 단위로 라이브러리와 샘플을 제공하지만 빠른 시일내에 손쉽게 사용할 수 있는 컴포넌트 또는 RTL로 제공되길 기대합니다.


관련글



험프리 험프리.김현수 RAD Studio 정보

개발환경 설정 - 안드로이드 개발환경

2015. 6. 9. 11:32

안드로이드 개발환경 설정

RAD Studio를 기본 설정으로 설치하면 안드로이드 앱을 개발할 수 있는 안드로이드 관련 소프트웨어(SDK, NDK, JDK 등)가 기본 설치됩니다.


1, 안드로이드 도구 설치확인하기

Android Tools 설치 확인

윈도우 시작 메뉴(시작버튼 > 앱 보기 > Embarcadero RAD Studio [버전])에서 Android Tools 항목을 확인합니다.


Android Tools 설치(설치하지 않은 경우)

만약, Android Tools 항목이 보이지 않는다면 Modify, Repair, Unistall 메뉴를 선택하고, 다음 화면에서 Android SDK와 Android NDK를 다시 설치하기 바랍니다.


2, 실제 디바이스 연결하기

개발PC와 디바이스 연결

개발 PC와 안드로이드 디바이스를 USB 케이블로 연결합니다. 개발 PC에는 안드로이드 디바이스를 인식하기 위한 USB 드라이버가 설치되어 있어야 합니다.
USB 드라이버 설치가 잘 되어 있다면 아래와 같이 탐색기에 디바이스 목록이 장치 관리자에 Android Phone 목록이 표시됩니다.


USB 드라이버 설치(USB 드라이버가 설치되어 있지 않은 경우)

만약, USB 드라이버가 설치되지 않은 경우 각 디바이스 제조사의 웹사이트를 통해 USB 드라이버 설치파일을 다운로드 받아 설치해야 합니다.


USB 디버깅 설정

개발 PC와 안드로이드 디바이스가 연결되어 있어도, 디바이스에서 USB 디버깅을 사용하도록 설정해야 앱을 배포하고 디버깅할  수 있습니다.

안드로이드 디바이스의 환경설정 > 개발자 옵션 > USB 디버깅 항목을 체크(선택) 합니다.


만약, 개발자 옵션 메뉴가 표시되지 않는다면 "환경설정 > 디바이스 정보 > 빌드 번호" 메뉴를 7회 터치하면 개발자 옵션 메뉴가 표시됩니다.(인드로이드 4.2 이상에서는 개발자 옵션이 기본적으로 감춰져 있습니다.)


USB 디버깅 허용

개발 PC와 장치 연결 시 "USB 디버깅을 허용할까요?" 메시지가 표시되면 허용해야합니다.

3, RAD Studio와 연결 확인하기

앞의 과정을 진행하면 개발PC와 디바이스 연결이 완료되었습니다. 이제 RAD Studio를 열고, File > New > Multi-Deivce Application 메뉴로 새로운 프로젝트를 만듭니다.

우측의 프로젝트 매니저에서 Target Platforms > Android > Target 트리메뉴를 확장하면 아래 그림과 같이 개발 PC와 연결된 디바이스 목록이 표시됩니다.


관련 글



험프리 험프리.김현수 파이어몽키

RAD Studio MidaConverter로 VCL 프로젝트를 FMX 프로젝트로 변환하기

2015. 6. 4. 14:04

Mida Converter

Mida Converter는 윈도우용 VCL 프로젝트 파일(폼과 소스)을 윈도우, 맥, 아이패드, 안드로이드용 파이어몽키 프로젝트 파일로 변환해주는 소스코드 변환 도구입니다.(별도 제품이므로 개별적인 설치가 필요합니다.)


현재(2015년 06월) RAD Studio 구입 시 Mida Converter Basic 에디션을 제공하는 프로모션을 진행하고 있습니다. ☞ 프로모션 보기

Basic 에디션은 "이미지 변환 미지원, 사용자정의 컨버젼 미지원" 등의 기능 제약이 있으므로 다양한 기능을 원한다면 http://www.midaconverter.com/에서 상위 에디션을 구입하시기 바랍니다.

❑ Mida Converter 다운로드

엠바카데로 EDN(Embarcadero Developer Network) 사이트의 등록된 제품 다운로드 페이지에서 다운로드 가능합니다.(해당 페이지는 Mida Converter 뿐 아니라 프로모션 시 제공받는 다양한 툴들을 다운로드 받을 수 있습니다.)

❑ Mida Converter 설치하기

다운로드 받은 압축파일을 압축해제하고 인스톨파일(Mida_XE8_Installer.exe)을 실행합니다.


안내에 따라 설치를 진행합니다.(별다른 주의사항은 없습니다.)


설치가 완료되면 RAD Studio 메인메뉴의 Tools에 Mida - Convert VCL To FireMonkey 메뉴가 추가됩니다.(만약, 해당 메뉴가 보이지 않으면 RAD Studio를 재시작하시기 바랍니다.)


❑ 샘플로 Mida Converter 돌려보기

EDN 사이트에서 다운로드 받은 압축파일에는 설치파일과 함께 예제 디렉토리(Basic_XE8_Example)가 포함되어 있습니다.

예제 프로젝트로 VCL 프로젝트를 파이어몽키 프로젝트로 변환해 봅니다.

  1. RAD Studio를 실행합니다.
  2. Basic_XE8_Example 디렉토리의 프로젝트를 오픈합니다.(Delphi, CPP 중 선택)
  3. Tools > Mida - Vonvert VCL To FireMonkey 메뉴를 클릭합니다.
  4. 변환 대상 VCL 프로젝트 경로와 저장할 파이어몽키 프로젝트 경로를 지정합니다.
    • Source directory : (다운로드 경로)\30232_mida_converter_basic_for_rad_studio_xe8\Basic_XE8_Example\Delphi
    • Destination directory : (다운로드 경로)\30232_mida_converter_basic_for_rad_studio_xe8\Basic_XE8_Example\DelphFireMonkey
  5. Convert project 버튼을 눌러 VCL 프로젝트를 파이어몽키 프로젝트로 변환합니다.(금세 변환됩니다.)
  6. 이후 개발환경에 따라 윈도우, 맥, 아이패드, 안드로이드 태블릿으로 실행해보시기 바랍니다.

❑ 변환 전/후 실행화면

원본 실행화면(VCL)

변환 후 실행화면(파이어몽키)


윈도우 32bit


OSX(맥)



험프리 험프리.김현수 RAD Studio 정보

앱의 상태바(StatusBar) 제어하기(색상변경, 감추기, 투명하게)

2015. 6. 4. 11:08

iOS 상태바 제어하기

iOS 앱의 상태바 색상을 변경하고, 감추고, 투명하게 할 수 있습니다.

1, 상태바 색상 변경하기

상태바 색상은 폼의 색상(Fill.Color)을 그대로 반영합니다.

  • 폼의 Fill.Color 변경
  • 폼의 Fill.Kind = Solid

2, 전체화면 전환(상태바 감추기)

폼의 테두리를 표시하지 않으면 상태바도 표시되지 않습니다.

  • 폼의 BorderStyle = None
참고로 코드로 BorderStyle을 변경 시 메모리 참조 에러가 간혹 발생합니다. 만약, 코드로 전체화면으로 전환이 필요한 경우 아래글의 Under the hood – FullScreen & TPlatformServices 섹션을 참고하시기 바랍니다.

3, 상태바 투명하게 하기

상태바를 투명하게 하기 위해서는 파이어몽키 소스코드(FMX.Platform.iOS.pas)를 수정해야합니다.

다음 글을 세번째 항목(三、透明状态栏(能见底图))을 참고하시기 바랍니다.


중국인 개발자(龟山阿卍)의 블로그입니다. 


Tip> 파이어몽키  소스코드를 수정하기

1, RAD Studio 소스코드 경로에서 파이어몽키 소스코드를 복사합니다.(설치경로로\source)

2, 프로젝트 경로에 파이어몽키 소스코드를 붙여넣기 합니다.

3, 프로젝트 매니저에서 위의 파이어몽키 소스코드를 추가합니다.

4, 프로젝트의 파이어몽키 소스코드를 수정 후 컴파일 시 프로젝트의 소스코드를 참고해 빌드됩니다.

안드로이드 상태바 제어하기

안드로이드는 XE7부터 몰입(Immersive)모드를 지원합니다. 몰입모드는 Android KitKat(4.4) 이상에서 동작합니다.

전체화면(상태바 감추기)

폼의 FullScreen 속성을 이용해 전체화면으로 전환/해제 할 수 있습니다.

  • 폼의 FullScreen = True
FullScreen 진입해 전체화면이 되면 상/하단을 쓸어 시스템 메뉴를 표시할 수 있습니다.

참고 글




험프리 험프리.김현수 파이어몽키

[XE8] 스피드버튼의 이미지를 크게 표시할 수 있습니다.

2015. 6. 4. 10:32

파이어몽키에 이미지리스트가 추가(XE8~)되어 스피드버튼에 이미지 표시가 아주 편리해졌습니다.


하지만, 이미지의 기본크기가 너무 작다고 느끼신 경우 다음 글을 통해 스타일을 수정해 큼지막한 이미지를 표시해 보세요.



중국인 개발자(龟山阿卍)의 블로그입니다. 


험프리 험프리.김현수 파이어몽키 Imagelist, Speedbutton, XE8

[XE8] RAD Studio XE8을 지원하는 외부 컴포넌트와 도구

2015. 5. 28. 11:41

델파이 XE8과 C++빌더 XE8을 지원하는 오픈소스 컴포넌트와 도구, 플러그인입니다.

❑ JCL / JVCL

다양한 기능을 제공하는 델파이, C++빌더 개발자들에게 익숙한 JCL/JVCL 컴포넌트

  • JCL - https://github.com/project-jedi/jcl
  • JVCL - https://github.com/project-jedi/jvcl

❑ IDE Fix Pack

IDE를 최적화해주는 플러그인

❑ GExperts

IDE에 유용한 기능을 추가 해주는 플러그인

❑ DDevExtensions

IDE 기능을 확장해주는 플러그인

❑ CnPack

IDE 기능을 확장해 주는 플러그인


RAD Studio XE8 추가기능인 Getit..(패키지 관리자)에서 엠바카데로가 호스팅하는 컴포넌트를 찾아 설치할 수 있습니다.

❑ Getit(패키지 관리자)


험프리 험프리.김현수 Delphi/C++Builder

JVCL(JCL) 써드파티 컴포넌트 최신버전을 받기

2015. 5. 27. 16:13


JVCL/JCL 컴포넌트는 오픈소스로 진행되는 써드파티 컴포넌트로, 델파이 6 부터 XE8(2015.5월 기준)까지 지원합니다.

(기존 소스포지에서 깃허브로 둥지를 옮긴듯해요.)

험프리 험프리.김현수 Delphi/C++Builder

블로그를 해킹당해 복구 중입니다.

2015. 5. 27. 13:40

ㅠㅜ

험프리 험프리.김현수 기타정보

RAD Studio XE8로 윈도우 10 애플리케이션 만들기

2015. 5. 26. 13:57

RAD Studio와 윈도우 10

올 여름 출시예정인 윈도우 10은 기존 윈도우7, 윈도우8, 윈도우8.1에서 무료 업그레이드를 지원해 파급효과가 상당할 것으로 보입니다.


RAD Studio(델파이와 C++빌더)도 발빠르게 윈도우 10에 대한 대응이 이미 완료된 상태로, 윈도우10과 관련된 글들이 하나 둘 올라오고 있습니다.

(윈도우10이 정식 출시되고 나면, RAD Studio도 그 이후 버전에서는 "윈도우 10 정식지원"을 명시할 수 있을 것입니다.)

❑ 윈도우 10에서  RAD Studio XE8 설치 후 테스트


윈도우10 프리뷰 버전을 설치하고 RAD Studio XE8 설치 후 간단한 메시지 애플리케이션을 제작했습니다. 

(당연한 결과지만 RAD Studio XE8 설치와 개발은 매우 순조롭게 진행되었습니다.) 

윈도우10 프리뷰는 윈도우즈 인사이더 프로그램(https://insider.windows.com/)을 통해서 다운로드 및 설치할 수 있습니다.


"새로운" VCL 컴포넌트를 이용하면 윈도우 10의 다음 기능을 활용한 애플리케이션을 만들 수 있습니다.

  • 작업표시줄 컴포넌트(TTaskbar)로 진행률표시, 오버레이 아이콘, 작업표시줄 버튼 미리보기를 추가하고 사용자 정의 합니다.
  • 작업표시줄 바로가기 컴포넌트(TJumpList)로 작업표시줄 바로가기 메뉴에 항목을 추가하고, 최근 파일 바로가기 등의 기능을 구현할 수 있습니다.
  • 트레이아이콘 컴포넌트를 사용해 트레이 아이콘 영역에 알림을 표시합니다.
  • 위치와 동작 센서등을 사용해해 애플리케이션이 실행중인 하드웨어 자원을 십분 활용할 수 있습니다.
  • 오래된 OpenDialog 컴포넌트 대신 FileOpenDialog 대화상자를 이용할 수 있습니다.
  • 블루투스 컴포넌트를 이용해 장비들과 무선 통신할 수 있습니다.
더 자세한 내용은 엠바카데로 커뮤니티 사이트의 원글을 통해 확인하기 바랍니다.

❑ 윈도우 10용 VCL 스타일 사용하기


VCL 애플리케이션에서 윈도우 10 스타일을 적용할 수 있도록 윈도우10 스타일의 VCL 스타일을 제공합니다.

위 화면은 VCL 스타일을 이용해 빌드한 앱으로 윈도우10의 전체화면 모드를 잘 표현하고 있습니다. 윈도우10은 데스크탑과 모바일을 모두 지원하며 전체화면 모드가 적극 활용됩니다.

아래 원글을 통해 윈도우10 VCL 스타일에 대해 더 알아보기 바랍니다.


윈도우10 스타일 다운로드:


관련 글



험프리 험프리.김현수 RAD Studio 정보

[XE8] 애플리케이션 외관을 멋지고 일관되게 적용할 수 있는 프리미엄 스타일(Radiant, Vapor 추가)

2015. 5. 19. 09:48

RAD Studio XE8 프리미엄 스타일

RAD Studio는 기본으로 제공하는 스타일 외에 RAD Studio XE8 사용자에게 43 종의 프리미엄 스타일을 추가 제공합니다.

  • VCL 스타일 : 7종
  • 파이어몽키 스타일 : 안드로이드, iOS, 윈도우, 맥 각 9종

그 중 RAD Studio XE8에 새로 추가된 스타일(각 2종)을 소개합니다.

❑ VCL 프리미엄 스타일


Radiant


Vapor


VCL 프리미엄 스타일 다운로드


❑ 파이어몽키 프리미엄 스타일


Radiant(iOS)


Vapor(iOS)


파이어몽키 프리미엄 스타일 다운로드


스타일 사용 방법은 다음 글을 참고하기 바랍니다.

관련 글




험프리 험프리.김현수 RAD Studio 정보 새로운기능-XE8

[JVESoft] 광고와 결재 컴포넌트(AdMob, Paypal 등)

2015. 5. 18. 09:29

JVESoft는 각종 광고 플랫폼과 결재 플랫폼에 연결할 수 있는 컴포넌트를 제작해 판매하고 있습니다.


RAD Studio에서는 TBannerAd 컴포넌트로 광고기능TInAppPuchase 컴포넌트로 결재 기능을 지원하고 있습니다.

각 컴포넌트의 기능과 편의성을 검토해 보시고 원하는 컴포넌트를 선택해서 광고와 결재기능을 여러분의 앱에 추가하시기 바랍니다.




험프리 험프리.김현수 파이어몽키

[iOS] 배포파일 아이클라우드 백업 옵션설정하기

2015. 5. 18. 09:15

iOS앱 배포 시 함께 배포하는 파일에 대해 아이클라우드 백업 설정하는 코드입니다.

대상은 "StartUp\Documents"에 배포하는 파일이며, 아이클라우드 백업 설정하지 않으면 앱스토어 배포 시 리젝처리 될수 있다고 하니 아래 코드를 참고해서 아이클라우드 백업 설정처리하시기 바랍니다.

uses iOSapi.Foundation;
 
function SetBackupFlag( AFileName: string; ABackup: boolean): boolean;
var
  URL : NSUrl;
  Err : PPointer;
begin
  URL := TNSURL.Wrap(TNSURL.OCClass.fileURLWithPath(NSStr(AFileName)));
  Result := URL.setResourceValue(TNSNumber.OCClass.numberWithBool(not ABackup),
              NSStr ('NSURLIsExcludedFromBackupKey'), err) and (err = nil);
end;



참고 글



험프리 험프리.김현수 파이어몽키

[XE8] 번거로운 수작업을 줄여 핵심기능 개발에 집중할 수 있는 개발 생산성 향상도구

2015. 4. 27. 16:24

RAD Studio XE8에는 수작업을 줄여주는 다양한 생산성 도구들이 추가되었습니다.


이제 번거로운 수작업을 줄이고 여러분의 비지니스 핵심기능 개발에 집중할 수 있습니다.

다중 붙여넣기(MultiPaste)

다중 붙여넣기는 클립보드에 복사된 문자열의 라인별로 앞과 뒤에 추가로 문자를 덧붙이는 기능입니다.

(XE8에서는) Castalia > MultiPaste 메뉴를 통해 사용할 수 있습니다.


사용 예> SQL 문자열 만들기


위의 화면은 SQL 문의 각 라인 앞과 뒤에 델파이의 문자열로 만드는 따옴표를 붙이는 예입니다. 클립보드에는 아래의 문자열이 포함되어 있습니다.

SELECT * 
  FROM EMPLOYREE EMP,
       ORDER ORD
 WHERE EMP.ORDER_ID = ORD.ORDER_ID
ORDER BY EMP_NO

OK 버튼을 누르면 코드 에디터에 Paste Options이 적용된 델파이 형식의 SQL 문이 추가됩니다.


☞ 자세한 내용은 카스탈리아 기술문서: How to Use Multipaste Tool (Castalia)를 참고하시기 바랍니다.

클립보드 히스토리(Clipboard History)

클립보드 히스토리는 클립보드에 복사했던 데이터를 목록 제공해 다시 사용할 수 있는 기능입니다. 


클립보드 데이터는 클립보드로 복사 시 이전의 클립보드 내용이 없어져 복사 > 붙여넣기를 반복해야 했는데요. 클립보드 히스토리에는 총 10개의 클립보드 데이터 이력을 제공해 개발작엡의 생산성을 작게나마 높여줍니다.

데이터를 클립보드로 다시 복사하는 Copy to clipboard와 코드 에디터로 데이터를 입력하는 Insert in Editor 2가지의 기능을 제공합니다.


☞ 자세한 내용은 카스탈리아 기술문서: Clipboard History를 참고하시기 바랍니다.


한번에 윈도우, 맥, iOS, 안드로이드, 사물인터넷(IoT)을 개발할 수 있는


관련 글



험프리 험프리.김현수 RAD Studio 정보

[XE8] TAppAnalytics 컴포넌트로 앱의 사용량 수집, 분석해 사용성을 이해할 수 있습니다.

2015. 4. 27. 13:17

RAD Studio XE8에는 애플리케이션 사용량 분석할 수 있는 TAppAnalytics 컴포넌트가 추가되었습니다.


이제 애플리케이션의 사용빈도, 사용자수, 오류 발생빈도를 수집, 분석 해 사용성을 이해할 수 있습니다.

TAppAnalytics

TAppAnalytics 컴포넌트는 사용자의 사용정보와 오류 발생 정보를 웹서비스(엠바카데로 제공)에 수집 후 분석해 사용성을 분석할 수 있는 컴포넌트입니다.

❑ 수집정보

TAppAnalytics는 다음 정보를 수집할 수 있습니다.

  • 애플리케이션 사용 빈도

  • 애플리케이션 활성 사용자 수

  • 애플리케이션 크래쉬 발생빈도

  • 애플리케이션에서 사용자가 폼과 컨트롤 사용빈도

 TAppAnalytics 컴포넌트는 동일한 컴포넌트 명으로 설계되었지만 내부 구현은 VCL과 파이어몽키가 다르게 구현되어 있습니다.


FMX TAppAnalytics 속성


VCL의 TAppAnalytics 속성


컴포넌트의 주요 속성은 다음과 같습니다.

  • ApplicationID : AppAnalytics 웹서비스에 회원가입 후 발급받는 ID를 입력
  • Options : 수집/추적할 항목을 선택
  • CacheSize : 내부 캐쉬의 크기
  • UpdateInterval : 웹서버에 제출할 주기
  • PrivacyMessage : 개인정보보호 안내 메시지

엠바카데로에서는 TAppAnalytics 컴포넌트에서 수집한 정보를 분석할 수 있도록 웹서비스(http://appanalytics.embarcadero.com/)를 제공합니다.(사용량만큼만 과금하는 SaaS방식으로 제공합니다.)



수집하는 데이터에는 사용자의 개인정보 수집 및 전송하지 않습니다. 정보는 완전하게 익명으로되어 있습니다. 사용자정의 이벤트로 정보를 수집하는 경우에도 개인정보를 수집하지 않도록 주의 하기 바랍니다.


수집을 시작하면 아래와 같은 개인정보보호 안내 메시지가 표시됩니다.(PrivacyMessage 속성으로 내용을 수정할 수 있습니다.)


☞ 앱 분석에 대한 자세한 정보는 엠바카데로 기술문서를 참고하기 바랍니다.



험프리 험프리.김현수 RAD Studio 정보 App Analytics, TAppAnalytics, XE8

[XE8] 오프라인에서 도움말을 볼 수 있습니다.(CHM 형식)

2015. 4. 17. 11:14

RAD Studio XE8에서는 새로운 오프라인 도움말 시스템을 제공합니다.


이제 더 빠르고 간편하게 그리고 인터넷이 되지 않는 환경에서도 RAD Studio 도움말을 볼 수 있습니다.

CHM 형식 오프라인 도움말


Help > RAD Studio Help 메뉴를 통해서 이용할 수 있습니다.


최신 내용의 온라인 도움말은 아래 링크를 이용하세요.


관련 글



험프리 험프리.김현수 RAD Studio 정보

[XE8] 대화형 지도 컴포넌트로 구글맵과 애플 맵킷 한번에 사용하기

2015. 4. 17. 11:02

RAD Studio XE8에는 대화형 맵 컴포넌트이 TMapView가 추가되었습니다.


이제 구글맵 API와 애플 맵킷 프레임워크를 이용한 지도앱을 하나의 소스코드로 개발할 수 있습니다.

TMapView - 대화형 맵 컴포넌트

iOSAndroid

iPad

Android (LG - E612)


 TMapView는 iOS와 안드로이드 앱에서 지도기능을 하나의 코드로 개발할 수 있도록 지원하는 컴포넌트입니다. 컴포넌트는 하나지만 내부적으로는 아래와 같이 대상 플랫폼에 따라 다른 지도 API를 사용합니다.

TMapView 컴포넌트는 다음 기능을 제공합니다.

  • 4 종류의 지도 : 표준, 위성사진, 하이브리드, 지형도도(안드로이드만)
  • 제스처 제어 : 틸트(기울이기), 회전, 줌 동작으로 제어
  • 맵보기 제어 : 지도의 중심좌표와 방향 등 지도 특성 제어가능
  • 사용자 정의 마커 : 지도에 마커를 추가할 수 있습니다.

자세한 TMapView 사용법은 모바일 튜투리얼: 맵 컴포넌트를 사용해 지도 조작하기 (iOS 및 Android)을 통해 익혀보시기 바랍니다.

샘플에서는 다음 기술을 사용합니다.

  • 지도 유형 선택
  • 지도 회전
  • 지도 중심좌표 지정
  • 마커 추가

한번에 윈도우, 맥, iOS, 안드로이드, 사물인터넷(IoT)을 개발할 수 있는

관련 글



험프리 험프리.김현수 RAD Studio 정보

[XE8] 멀티-디바이스 미리보기: 다양한 디바이스 화면을 미리보며 최적화된 화면 개발하기

2015. 4. 16. 18:21

RAD Studio XE8에서는 작업 중인 화면(Form)을 여러 장치에서 어떻게 표시되는지 확인 할 수 있는 멀티-디바이스 미리보기 기능이 추가되었습니다.


이제 다양한 디바이스 화면에 맞춰 개발한 화면을 미리볼 수 있어, 각각의 디바이스에 최적화된 화면개발이 더 쉬워집니다.

멀티-디바이스 미리보기


멀티-디바이스 미리보기는 멀티-디바이스 디자이너에서 다양한 디바이스 해상도와 스타일에 맞게 각각 구성한 화면이 어떻게 표현되는지 한눈에 볼수있는 미리보기 화면입니다.


미리보기 화면에 표시되는 디바이스는 다음과 같습니다.

  1. 멀티-디바이스 디자이너에서 생성된(Created) View가 기본으로 표시됩니다.
  2. 멀티-디바이스 프리뷰에서 디바이스를 직접 추가할 수 있습니다.

멀티-디바이스 뷰

☞ 멀티-디바이스 미리보기에 대한 자세한 내용은 엠바카데로 기술문서: 멀티 디바이스 미리보기를 참고하세요.

❑ 디바이스 매니저(Device Manager)

RAD Studio에서는 기본으로 17종의 디바이스 종류를 제공합니다. 새로운 디바이스를 추가, 수정, 삭제는 디바이스 매니저를 통해 할 수 있습니다.


디바이스 매니저는 Tools > Option > Environment Options > Form Designer > Device Manager 메뉴로 실행할 수 있습니다.

☞ 디바이스 매니저에 대한 자세한 내용은 엠바카데로 기술문서: 디바이스 매니저를 참고하세요.


한번에 윈도우, 맥, iOS, 안드로이드, 사물인터넷(IoT)을 개발할 수 있는



관련 글


험프리 험프리.김현수 RAD Studio 정보