<?xml version="1.0"?>
<feed xmlns="http://www.w3.org/2005/Atom" xml:lang="en">
	<id>https://trans.onionmixer.net/wiki/index.php?action=history&amp;feed=atom&amp;title=TheSpecUIframework%3AChapter_04</id>
	<title>TheSpecUIframework:Chapter 04 - Revision history</title>
	<link rel="self" type="application/atom+xml" href="https://trans.onionmixer.net/wiki/index.php?action=history&amp;feed=atom&amp;title=TheSpecUIframework%3AChapter_04"/>
	<link rel="alternate" type="text/html" href="https://trans.onionmixer.net/wiki/index.php?title=TheSpecUIframework:Chapter_04&amp;action=history"/>
	<updated>2026-05-01T21:29:22Z</updated>
	<subtitle>Revision history for this page on the wiki</subtitle>
	<generator>MediaWiki 1.43.3</generator>
	<entry>
		<id>https://trans.onionmixer.net/wiki/index.php?title=TheSpecUIframework:Chapter_04&amp;diff=5414&amp;oldid=prev</id>
		<title>Onionmixer: 목차오류 수정</title>
		<link rel="alternate" type="text/html" href="https://trans.onionmixer.net/wiki/index.php?title=TheSpecUIframework:Chapter_04&amp;diff=5414&amp;oldid=prev"/>
		<updated>2017-08-19T15:42:38Z</updated>

		<summary type="html">&lt;p&gt;목차오류 수정&lt;/p&gt;
&lt;table style=&quot;background-color: #fff; color: #202122;&quot; data-mw=&quot;interface&quot;&gt;
				&lt;col class=&quot;diff-marker&quot; /&gt;
				&lt;col class=&quot;diff-content&quot; /&gt;
				&lt;col class=&quot;diff-marker&quot; /&gt;
				&lt;col class=&quot;diff-content&quot; /&gt;
				&lt;tr class=&quot;diff-title&quot; lang=&quot;en&quot;&gt;
				&lt;td colspan=&quot;2&quot; style=&quot;background-color: #fff; color: #202122; text-align: center;&quot;&gt;← Older revision&lt;/td&gt;
				&lt;td colspan=&quot;2&quot; style=&quot;background-color: #fff; color: #202122; text-align: center;&quot;&gt;Revision as of 15:42, 19 August 2017&lt;/td&gt;
				&lt;/tr&gt;&lt;tr&gt;&lt;td colspan=&quot;2&quot; class=&quot;diff-lineno&quot; id=&quot;mw-diff-left-l48&quot;&gt;Line 48:&lt;/td&gt;
&lt;td colspan=&quot;2&quot; class=&quot;diff-lineno&quot;&gt;Line 48:&lt;/td&gt;&lt;/tr&gt;
&lt;tr&gt;&lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;&lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;br&gt;&lt;/td&gt;&lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;&lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;br&gt;&lt;/td&gt;&lt;/tr&gt;
&lt;tr&gt;&lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;&lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;br&gt;&lt;/td&gt;&lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;&lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;br&gt;&lt;/td&gt;&lt;/tr&gt;
&lt;tr&gt;&lt;td class=&quot;diff-marker&quot; data-marker=&quot;−&quot;&gt;&lt;/td&gt;&lt;td style=&quot;color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #ffe49c; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;===위젯 인스턴스화===&lt;/div&gt;&lt;/td&gt;&lt;td class=&quot;diff-marker&quot; data-marker=&quot;+&quot;&gt;&lt;/td&gt;&lt;td style=&quot;color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #a3d3ff; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;&lt;ins style=&quot;font-weight: bold; text-decoration: none;&quot;&gt;=&lt;/ins&gt;===위젯 인스턴스화&lt;ins style=&quot;font-weight: bold; text-decoration: none;&quot;&gt;=&lt;/ins&gt;===&lt;/div&gt;&lt;/td&gt;&lt;/tr&gt;
&lt;tr&gt;&lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;&lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;br&gt;&lt;/td&gt;&lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;&lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;br&gt;&lt;/td&gt;&lt;/tr&gt;
&lt;tr&gt;&lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;&lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;위젯에 대한 모델의 인스턴스화는 생성 메소드(creation method)의 사용 또는 instantiate: 메소드의 사용의 두 가지 방법으로 수행 할 수 있습니다.&lt;/div&gt;&lt;/td&gt;&lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;&lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;위젯에 대한 모델의 인스턴스화는 생성 메소드(creation method)의 사용 또는 instantiate: 메소드의 사용의 두 가지 방법으로 수행 할 수 있습니다.&lt;/div&gt;&lt;/td&gt;&lt;/tr&gt;
&lt;/table&gt;</summary>
		<author><name>Onionmixer</name></author>
	</entry>
	<entry>
		<id>https://trans.onionmixer.net/wiki/index.php?title=TheSpecUIframework:Chapter_04&amp;diff=5413&amp;oldid=prev</id>
		<title>Onionmixer: 번역수정</title>
		<link rel="alternate" type="text/html" href="https://trans.onionmixer.net/wiki/index.php?title=TheSpecUIframework:Chapter_04&amp;diff=5413&amp;oldid=prev"/>
		<updated>2017-08-19T15:40:38Z</updated>

		<summary type="html">&lt;p&gt;번역수정&lt;/p&gt;
&lt;table style=&quot;background-color: #fff; color: #202122;&quot; data-mw=&quot;interface&quot;&gt;
				&lt;col class=&quot;diff-marker&quot; /&gt;
				&lt;col class=&quot;diff-content&quot; /&gt;
				&lt;col class=&quot;diff-marker&quot; /&gt;
				&lt;col class=&quot;diff-content&quot; /&gt;
				&lt;tr class=&quot;diff-title&quot; lang=&quot;en&quot;&gt;
				&lt;td colspan=&quot;2&quot; style=&quot;background-color: #fff; color: #202122; text-align: center;&quot;&gt;← Older revision&lt;/td&gt;
				&lt;td colspan=&quot;2&quot; style=&quot;background-color: #fff; color: #202122; text-align: center;&quot;&gt;Revision as of 15:40, 19 August 2017&lt;/td&gt;
				&lt;/tr&gt;&lt;tr&gt;&lt;td colspan=&quot;2&quot; class=&quot;diff-lineno&quot; id=&quot;mw-diff-left-l33&quot;&gt;Line 33:&lt;/td&gt;
&lt;td colspan=&quot;2&quot; class=&quot;diff-lineno&quot;&gt;Line 33:&lt;/td&gt;&lt;/tr&gt;
&lt;tr&gt;&lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;&lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;initializeWidgets 메소드는 인스턴스 변수를 인스턴스화 하고 저장하며, UI 의 일부가 될 다른 위젯을 부분적으로 구성합니다. 모델을 인스턴스화하면 다른 하위 수준의 사용자 인터페이스 구성 요소가 인스턴스화되고 초기화되어 사용자에게 표시되는 UI가 생성됩니다. 각 위젯 구성의 첫 번째 부분이 여기서도 지정되므로 이 메소드를 initializeWidgets 라고 부릅니다. 이 메소드의 요점은 위젯의 모양과 자체 포함(self-contained) 행동방식을 명시하는 것입니다. 모델의 상태를 업데이트하는 동작은(예 : Save 버튼을 누를 때) 이 메서드에서도 기술(described)됩니다. 위젯 간의 &amp;#039;&amp;#039;상호 작용(between)&amp;#039;&amp;#039; 을 정의하는 것은, 이 메소드의 책임이 아니라 &amp;#039;&amp;#039;명시적이지 않은&amp;#039;&amp;#039; 것입니다. 명시적이지는 &amp;#039;&amp;#039;않지만&amp;#039;&amp;#039; 위젯 &amp;#039;&amp;#039;사이에서&amp;#039;&amp;#039; 상호 작용을 정의하는 것은 이 메서드의 책임입니다.&lt;/div&gt;&lt;/td&gt;&lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;&lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;initializeWidgets 메소드는 인스턴스 변수를 인스턴스화 하고 저장하며, UI 의 일부가 될 다른 위젯을 부분적으로 구성합니다. 모델을 인스턴스화하면 다른 하위 수준의 사용자 인터페이스 구성 요소가 인스턴스화되고 초기화되어 사용자에게 표시되는 UI가 생성됩니다. 각 위젯 구성의 첫 번째 부분이 여기서도 지정되므로 이 메소드를 initializeWidgets 라고 부릅니다. 이 메소드의 요점은 위젯의 모양과 자체 포함(self-contained) 행동방식을 명시하는 것입니다. 모델의 상태를 업데이트하는 동작은(예 : Save 버튼을 누를 때) 이 메서드에서도 기술(described)됩니다. 위젯 간의 &amp;#039;&amp;#039;상호 작용(between)&amp;#039;&amp;#039; 을 정의하는 것은, 이 메소드의 책임이 아니라 &amp;#039;&amp;#039;명시적이지 않은&amp;#039;&amp;#039; 것입니다. 명시적이지는 &amp;#039;&amp;#039;않지만&amp;#039;&amp;#039; 위젯 &amp;#039;&amp;#039;사이에서&amp;#039;&amp;#039; 상호 작용을 정의하는 것은 이 메서드의 책임입니다.&lt;/div&gt;&lt;/td&gt;&lt;/tr&gt;
&lt;tr&gt;&lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;&lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;br&gt;&lt;/td&gt;&lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;&lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;br&gt;&lt;/td&gt;&lt;/tr&gt;
&lt;tr&gt;&lt;td class=&quot;diff-marker&quot; data-marker=&quot;−&quot;&gt;&lt;/td&gt;&lt;td style=&quot;color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #ffe49c; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;&lt;del style=&quot;font-weight: bold; text-decoration: none;&quot;&gt;&lt;/del&gt;&lt;/div&gt;&lt;/td&gt;&lt;td colspan=&quot;2&quot; class=&quot;diff-side-added&quot;&gt;&lt;/td&gt;&lt;/tr&gt;
&lt;tr&gt;&lt;td class=&quot;diff-marker&quot; data-marker=&quot;−&quot;&gt;&lt;/td&gt;&lt;td style=&quot;color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #ffe49c; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;&lt;del style=&quot;font-weight: bold; text-decoration: none;&quot;&gt;In general the ==initializeWidgets== method should follow the pattern:&lt;/del&gt;&lt;/div&gt;&lt;/td&gt;&lt;td colspan=&quot;2&quot; class=&quot;diff-side-added&quot;&gt;&lt;/td&gt;&lt;/tr&gt;
&lt;tr&gt;&lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;&lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;br&gt;&lt;/td&gt;&lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;&lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;br&gt;&lt;/td&gt;&lt;/tr&gt;
&lt;tr&gt;&lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;&lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;일반적으로 initializeWidgets 메서드는 다음의 양식을 따르게 됩니다:&lt;/div&gt;&lt;/td&gt;&lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;&lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;일반적으로 initializeWidgets 메서드는 다음의 양식을 따르게 됩니다:&lt;/div&gt;&lt;/td&gt;&lt;/tr&gt;
&lt;/table&gt;</summary>
		<author><name>Onionmixer</name></author>
	</entry>
	<entry>
		<id>https://trans.onionmixer.net/wiki/index.php?title=TheSpecUIframework:Chapter_04&amp;diff=5412&amp;oldid=prev</id>
		<title>Onionmixer: TheSpecUIframework 4장 내용 완료</title>
		<link rel="alternate" type="text/html" href="https://trans.onionmixer.net/wiki/index.php?title=TheSpecUIframework:Chapter_04&amp;diff=5412&amp;oldid=prev"/>
		<updated>2017-08-19T15:39:30Z</updated>

		<summary type="html">&lt;p&gt;TheSpecUIframework 4장 내용 완료&lt;/p&gt;
&lt;a href=&quot;https://trans.onionmixer.net/wiki/index.php?title=TheSpecUIframework:Chapter_04&amp;amp;diff=5412&amp;amp;oldid=5411&quot;&gt;Show changes&lt;/a&gt;</summary>
		<author><name>Onionmixer</name></author>
	</entry>
	<entry>
		<id>https://trans.onionmixer.net/wiki/index.php?title=TheSpecUIframework:Chapter_04&amp;diff=5411&amp;oldid=prev</id>
		<title>Onionmixer: TheSpecUIframework 4장 내용 추가</title>
		<link rel="alternate" type="text/html" href="https://trans.onionmixer.net/wiki/index.php?title=TheSpecUIframework:Chapter_04&amp;diff=5411&amp;oldid=prev"/>
		<updated>2017-08-18T16:16:55Z</updated>

		<summary type="html">&lt;p&gt;TheSpecUIframework 4장 내용 추가&lt;/p&gt;
&lt;p&gt;&lt;b&gt;New page&lt;/b&gt;&lt;/p&gt;&lt;div&gt;;Spec 의 기본 사항&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
==Spec 의 기본 사항==&lt;br /&gt;
&lt;br /&gt;
이 장에서는 Spec 의 주요 측면 및 구축(building) 과정의 중요한 맞춤 요소등을 다시 살펴보도록 하겠습니다.&lt;br /&gt;
&lt;br /&gt;
===사용자 인터페이스 구축: 구성하기===&lt;br /&gt;
&lt;br /&gt;
Spec 의 주요 측면은 모든 사용자 인터페이스가 기존 사용자 인터페이스의 작성 및 재사용을 통한 생성 등으로 구성된다는 점입니다.&lt;br /&gt;
이러한 구조를 허용하기 위해 사용자 인터페이스 정의는 사용자 인터페이스의 &amp;#039;&amp;#039;model&amp;#039;&amp;#039; 을 정의하고 화면에 표시 될 사용자 인터페이스 요소를 &amp;#039;&amp;#039;not&amp;#039;&amp;#039; 로 구성합니다. 이러한 UI 요소는 기본 UI 프레임 워크를 고려해서 Spec 에 의해 인스턴스화됩니다.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
결국, 그것은 모델의 구성 요소이며, 결과적으로 보여지는 최종 사용자 인터페이스를 구성하는 UI 요소가 됩니다. 또한 Spec 의 뿌리(root/루트) 구성 요소 이름도 설명합니다: 모든 UI 는 다른 UI 의 &amp;#039;&amp;#039;구성(composition)&amp;#039;&amp;#039; 을 통해 구성되며 &amp;#039;&amp;#039;UI&amp;#039;&amp;#039; 를 정의하기 위해 &amp;#039;&amp;#039;model&amp;#039;&amp;#039; 을 정의하는 것으로 충분하므로 모든 UI 의 루트 클래스 이름은 ComposableModel 입니다. 결과적으로 새 사용자 인터페이스를 정의하려면 ComposableModel 의 하위 클래스를 만들어야 합니다.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
사용자 인터페이스에서 다른 위젯의 구성 및 조정을 고려했을 때, Spec 은 Model-View-Presenter 패턴에서 영감을 얻었습니다.&lt;br /&gt;
Spec 에 정의 된 모델은 MVP 3각관계에서 발표자(presenter)에 해당합니다. 이 때문에, Spec 의 향후 버젼에서는, 이름의 일관성을 위해서, ComposableModel 을 ComposablePresenter 로 이름을 변경할 가능성이 있습니다.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
기본적으로, ComposableModel: 에서 다음의 세가지 메서드로 그들 스스로를 구체화하는 세가지 관심사로 구성되었습니다:&lt;br /&gt;
&lt;br /&gt;
* initializeWidgets 위젯 자체를 다루기&lt;br /&gt;
* initializePresenter 위젯 사이의 상호 작용을 처리하기&lt;br /&gt;
* defaultSpec 위젯의 레이아웃을 처리&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
따라서 이러한 방법은 각 사용자 인터페이스의 모델에서 흔히 발견할 수 있습니다. 이 장에서는 각 메서드의 세부 사항과, 이러한 세가지 방법을 통해 전반적인 UI를 구축하는 방법에 대해 설명합니다.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
===initializeWidgets 메서드===&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
==Notes==&lt;br /&gt;
&amp;lt;references /&amp;gt;&lt;br /&gt;
&lt;br /&gt;
[[Category:TheSpecUIframework]]&lt;/div&gt;</summary>
		<author><name>Onionmixer</name></author>
	</entry>
</feed>