| ページ一覧 | ブログ | twitter |　 書式 | 書式(表) |

MyMemoWiki

「Windows サイドバー 概要 ～ ガジェットの表示」の版間の差分

提供: MyMemoWiki
ナビゲーションに移動 検索に移動
(ページの作成:「==Windows サイドバー 概要 ～ ガジェットの表示== [Windows サイドバー][JavaScript] ===ガジェット=== ====概要==== *HTML およびスクリプ…」)
 
 
(同じ利用者による、間の3版が非表示)
1行目: 1行目:
−
==Windows サイドバー 概要 ～ ガジェットの表示==
+
==[[Windows サイドバー 概要 ～ ガジェットの表示]]==
−
[Windows サイドバー][JavaScript]
+
[[Windows サイドバー]] | [[JavaScript]] |
 
===ガジェット===
 
===ガジェット===
 
====概要====
 
====概要====
−
*HTML およびスクリプト ベースのアプリケーション
+
*[[HTML]] およびスクリプト ベースのアプリケーション
 
*情報または機能をユーザーに示す
 
*情報または機能をユーザーに示す
 
*のアプリケーション、コントロール、Web サイトおよびサービスから取得
 
*のアプリケーション、コントロール、Web サイトおよびサービスから取得
 
====構成要素 ====
 
====構成要素 ====
−
*XML
+
*[[XML]]
−
*HTML
+
*[[HTML]]
 
*JScript
 
*JScript
−
*CSS
+
*[[CSS]]
 
====.gadget ファイル====
 
====.gadget ファイル====
 
*構成要素のコレクションをzipアーカイブ
 
*構成要素のコレクションをzipアーカイブ
17行目: 17行目:
 
*ローカルからダブルクリックにより
 
*ローカルからダブルクリックにより
 
===[http://msdn.microsoft.com/ja-jp/library/bb508509(VS.85).aspx ガジェット マニフェスト]===
 
===[http://msdn.microsoft.com/ja-jp/library/bb508509(VS.85).aspx ガジェット マニフェスト]===
−
*全体構成や表示情報を記載したXML
+
*全体構成や表示情報を記載した[[XML]]
 
*ガジェットピッカーを通じてユーザーに提示
 
*ガジェットピッカーを通じてユーザーに提示
 
*ガジェットパッケージに同梱する必要がある
 
*ガジェットパッケージに同梱する必要がある
28行目: 28行目:
 
*基本は 2 つのファイルから構成  
 
*基本は 2 つのファイルから構成  
 
====マニフェスト====
 
====マニフェスト====
−
*XMLファイル
+
*[[XML]]ファイル
 
*名前はgadget.xml  
 
*名前はgadget.xml  
−
====HTML====
+
====[[HTML]]====
 
*UIを提供  
 
*UIを提供  
 
*コアコード  
 
*コアコード  
39行目: 39行目:
 
*開発およびテスト中は、サイドバーに関連するシステム フォルダに配置するとより効率的
 
*開発およびテスト中は、サイドバーに関連するシステム フォルダに配置するとより効率的
 
*これにより、ガジェットはガジェット ピッカーに表示され、後のファイル処理を最小限に抑えることができる
 
*これにより、ガジェットはガジェット ピッカーに表示され、後のファイル処理を最小限に抑えることができる
−
  %USER_DATA%\Local\Microsoft\Windows Sidebar\Gadgets (ユーザー ガジェット)  
+
  %USER_DATA%\Local\Microsoft\[[Windows]] Sidebar\Gadgets (ユーザー ガジェット)  
−
  %SYSTEM_ROOT%\Program Files\Windows Sidebar\Gadgets (グローバル ガジェット)  
+
  %SYSTEM_ROOT%\Program Files\[[Windows]] Sidebar\Gadgets (グローバル ガジェット)  
 
===3 つのプレゼンテーション要素===
 
===3 つのプレゼンテーション要素===
−
====G:BACKGROUND====
+
====G:BACKG[[R]]OUND====
 
*多数のメソッドを使用して、ガジェットの背景を宣言し、イメージ ソースを指定  
 
*多数のメソッドを使用して、ガジェットの背景を宣言し、イメージ ソースを指定  
−
*一般に、背景オブジェクトおよびそのイメージ ソースは、g:background 要素を使用してガジェット HTML ファイルで宣言  
+
*一般に、背景オブジェクトおよびそのイメージ ソースは、g:background 要素を使用してガジェット [[HTML]] ファイルで宣言  
 
*役割は、アルファチャンネルを持つPNG画像をガジェットの背景として配置すること  
 
*役割は、アルファチャンネルを持つPNG画像をガジェットの背景として配置すること  
  
−
<blockquote>CSSのpositionで「absolute」を指定し、HTMLのレイアウトとは無関係に左上隅に配置するように設定 </blockquote>
+
&lt;blockquote&gt;CSSのpositionで「absolute」を指定し、[[HTML]]のレイアウトとは無関係に左上隅に配置するように設定 &lt;/blockquote&gt;
  
−
<blockquote>その後の要素が背景イメージの下に配置されないようにするため、z-indexスタイルに-1を指定 </blockquote>
+
&lt;blockquote&gt;その後の要素が背景イメージの下に配置されないようにするため、z-indexスタイルに-1を指定 &lt;/blockquote&gt;
  
 
====GIMAGE ====
 
====GIMAGE ====
−
*標準 HTML imgタグより効率的にガジェット DOM にイメージを追加する  
+
*標準 [[HTML]] imgタグより効率的にガジェット DOM にイメージを追加する  
 
*リクエストされたファイルはローカル コンピュータにあることが必要  
 
*リクエストされたファイルはローカル コンピュータにあることが必要  
  
74行目: 74行目:
 
*サイドバーの基本的機能  
 
*サイドバーの基本的機能  
 
=====System.Gadget.SideShow =====
 
=====System.Gadget.SideShow =====
−
*Windows Vista SideShow デバイスでサイドバー機能  
+
*[[Windows Vista]] SideShow デバイスでサイドバー機能  
 
=====System.Gadget.Flyout =====
 
=====System.Gadget.Flyout =====
 
*Flyout 機能  
 
*Flyout 機能  
84行目: 84行目:
 
=====System.Diagnostics.EventLog =====
 
=====System.Diagnostics.EventLog =====
 
*Application イベント ログ エントリの書き込みに利用  
 
*Application イベント ログ エントリの書き込みに利用  
−
=====System.Environment =====
+
=====System.En[[vi]]ronment =====
 
*システムおよびユーザー環境変数を決定  
 
*システムおよびユーザー環境変数を決定  
−
=====System.Machine =====
+
=====System.[[Mac]]hine =====
 
*マシン プロセッサとメモリ特性を決定  
 
*マシン プロセッサとメモリ特性を決定  
−
=====System.Machine.CPU =====
+
=====System.[[Mac]]hine.CPU =====
−
*System.Machine.CPU コレクションの各メンバー  
+
*System.[[Mac]]hine.CPU コレクションの各メンバー  
−
=====System.Machine.PowerStatus =====
+
=====System.[[Mac]]hine.PowerStatus =====
 
*コンピュータの電源状態  
 
*コンピュータの電源状態  
 
=====System.MessageStore =====
 
=====System.MessageStore =====
−
*Microsoft Windows メール (旧称 Outlook Express)  
+
*Microsoft [[Windows]] メール (旧称 Outlook Express)  
 
=====System.MessageStore.Folder =====
 
=====System.MessageStore.Folder =====
−
*個々の Windows メール フォルダ  
+
*個々の [[Windows]] メール フォルダ  
 
=====System.MessageStore.Message =====
 
=====System.MessageStore.Message =====
−
*Windows メールの各メンバー  
+
*[[Windows]] メールの各メンバー  
 
=====System.Network.Wireless =====
 
=====System.Network.Wireless =====
 
*ワイヤレス ネットワーク接続性  
 
*ワイヤレス ネットワーク接続性  
 
=====System.Shell =====
 
=====System.Shell =====
−
*Windows Shell 特性を示す  
+
*[[Windows]] Shell 特性を示す  
 
=====System.Shell.Drive =====
 
=====System.Shell.Drive =====
 
*システム ストレージ デバイスの特性を示す  
 
*システム ストレージ デバイスの特性を示す  
107行目: 107行目:
 
*ファイル管理操作を実行  
 
*ファイル管理操作を実行  
 
=====System.Shell.Item =====
 
=====System.Shell.Item =====
−
=====System.Shell.RecycleBin =====
+
=====System.Shell.[[R]]ecycleBin =====
−
*Recycle Bin 特性  
+
*[[R]]ecycle Bin 特性  
 
=====System.Sound =====
 
=====System.Sound =====
 
=====System.Time =====
 
=====System.Time =====
124行目: 124行目:
 
====表示====
 
====表示====
 
=====gadget.xml=====
 
=====gadget.xml=====
−
  <?xml version="1.0" encoding="utf-8" ?>
+
  &lt;?xml version="1.0" encoding="utf-8" ?&gt;
−
  <gadget>
+
  &lt;gadget&gt;
−
   <name>WindowSidebarSample</name>
+
   &lt;name&gt;WindowSidebarSample&lt;/name&gt;
−
   <version>1.0.0.0</version>
+
   &lt;version&gt;1.0.0.0&lt;/version&gt;
−
   <hosts>
+
   &lt;hosts&gt;
−
     <host name="sidebar">
+
     &lt;host name="sidebar"&gt;
−
       <base type="HTML" apiVersion="1.0.0" src="WindowSidebarSample.html" />
+
       &lt;base type="[[HTML]]" apiVersion="1.0.0" src="WindowSidebarSample.html" /&gt;
−
       <permissions>Full</permissions>
+
       &lt;permissions&gt;Full&lt;/permissions&gt;
−
       <platform minPlatformVersion="1.0"/>
+
       &lt;platform minPlatformVersion="1.0"/&gt;
−
     </host>
+
     &lt;/host&gt;
−
   </hosts>
+
   &lt;/hosts&gt;
−
  </gadget>
+
  &lt;/gadget&gt;
 
=====WindowSidebarSample.html=====
 
=====WindowSidebarSample.html=====
−
  <html>
+
  &lt;html&gt;
−
  <head>
+
  &lt;head&gt;
−
   <style type="text/css">
+
   &lt;style type="text/css"&gt;
 
     body {
 
     body {
 
       /* ウィンドウサイズはBody要素に明示的に指定する */
 
       /* ウィンドウサイズはBody要素に明示的に指定する */
146行目: 146行目:
 
       height:250px;
 
       height:250px;
 
     }
 
     }
−
   </style>
+
   &lt;/style&gt;
−
   <script type="text/jscript" language="jscript">
+
   &lt;script type="text/jscript" language="jscript"&gt;
 
     function init() {
 
     function init() {
 
     }
 
     }
−
   </script>
+
   &lt;/script&gt;
−
  </head>
+
  &lt;/head&gt;
−
  <body onload="init()">
+
  &lt;body onload="init()"&gt;
−
   <!--
+
   &lt;!--
−
     ・ absolute を指定し、HTMLのレイアウトとは無関係に左上隅に配置
+
     ・ absolute を指定し、[[HTML]]のレイアウトとは無関係に左上隅に配置
 
     ・ 後の要素が背景イメージの下に配置されないようにz-indexスタイルに-1を指定
 
     ・ 後の要素が背景イメージの下に配置されないようにz-indexスタイルに-1を指定
−
     -->
+
     --&gt;
−
   <g:background id="imgBackground" src="images/background.png"  
+
   &lt;g:background id="imgBackground" src="images/background.png"  
−
                 style="position:absolute;z-index:-1;width:125px;height:250px;">
+
                 style="position:absolute;z-index:-1;width:125px;height:250px;"&gt;
−
   </g:background>
+
   &lt;/g:background&gt;
−
  </body
+
  &lt;/body
−
  </html>
+
  &lt;/html&gt;
 
=====結果=====
 
=====結果=====
 
*ガジェットの一覧に表示された
 
*ガジェットの一覧に表示された

2020年2月16日 (日) 04:34時点における最新版

Windows サイドバー 概要 ～ ガジェットの表示

Windows サイドバー | JavaScript |

ガジェット

概要

  • HTML およびスクリプト ベースのアプリケーション
  • 情報または機能をユーザーに示す
  • のアプリケーション、コントロール、Web サイトおよびサービスから取得

構成要素

.gadget ファイル

  • 構成要素のコレクションをzipアーカイブ

インストール

  • ダウンロードプロセスにより
  • ローカルからダブルクリックにより

ガジェット マニフェスト

  • 全体構成や表示情報を記載したXML
  • ガジェットピッカーを通じてユーザーに提示
  • ガジェットパッケージに同梱する必要がある
  • 名前は gadget.xml とする

開発

はじめに

  • Web サイトおよびサービスから取得した情報または機能をユーザーに示すことを目的
  • Web ページの作成経験がある方には身近

ファイル

  • 基本は 2 つのファイルから構成

マニフェスト

  • XMLファイル
  • 名前はgadget.xml

HTML

  • UIを提供
  • コアコード
  • マニフェストで指定された名前

作成手順

  • 通常、開発フォルダにはホストするガジェットと同じ名前を付け、拡張子 .gadget を付ける

配置

  • 開発およびテスト中は、サイドバーに関連するシステム フォルダに配置するとより効率的
  • これにより、ガジェットはガジェット ピッカーに表示され、後のファイル処理を最小限に抑えることができる
%USER_DATA%\Local\Microsoft\Windows Sidebar\Gadgets (ユーザー ガジェット) 
%SYSTEM_ROOT%\Program Files\Windows Sidebar\Gadgets (グローバル ガジェット)

3 つのプレゼンテーション要素

G:BACKGROUND

  • 多数のメソッドを使用して、ガジェットの背景を宣言し、イメージ ソースを指定
  • 一般に、背景オブジェクトおよびそのイメージ ソースは、g:background 要素を使用してガジェット HTML ファイルで宣言
  • 役割は、アルファチャンネルを持つPNG画像をガジェットの背景として配置すること

<blockquote>CSSのpositionで「absolute」を指定し、HTMLのレイアウトとは無関係に左上隅に配置するように設定 </blockquote>

<blockquote>その後の要素が背景イメージの下に配置されないようにするため、z-indexスタイルに-1を指定 </blockquote>

GIMAGE

  • 標準 HTML imgタグより効率的にガジェット DOM にイメージを追加する
  • リクエストされたファイルはローカル コンピュータにあることが必要

G:TEXT

Settings

  • 基本ガジェット UI に 2 つのユーザー インターフェイス (UI) 拡張子を定義
  • ガジェットから情報を保存するには、ファイルに書き込むのではなくこのオブジェクトを利用
  • System.Gadget.Settings
    • ガジェットの構成を変更
  • System.Gadget.Flyout
    • ガジェット UI に関する追加的詳細または情報を表示

リファレンス

Gadget オブジェクト

System.Gadget.Settings
  • Settings 機能
System.Gadget
  • 基本的機能
System.Gadget.Sidebar
  • サイドバーの基本的機能
System.Gadget.SideShow
System.Gadget.Flyout
  • Flyout 機能

システム オブジェクト

System.Contact
System.ContactManager
System.Debug
  • サイドバー ガジェット スクリプトのデバッグに利用
System.Diagnostics.EventLog
  • Application イベント ログ エントリの書き込みに利用
System.Environment
  • システムおよびユーザー環境変数を決定
System.Machine
  • マシン プロセッサとメモリ特性を決定
System.Machine.CPU
  • System.Machine.CPU コレクションの各メンバー
System.Machine.PowerStatus
  • コンピュータの電源状態
System.MessageStore
  • Microsoft Windows メール (旧称 Outlook Express)
System.MessageStore.Folder
  • 個々の Windows メール フォルダ
System.MessageStore.Message
  • Windows メールの各メンバー
System.Network.Wireless
  • ワイヤレス ネットワーク接続性
System.Shell
System.Shell.Drive
  • システム ストレージ デバイスの特性を示す
System.Shell.Folder
  • ファイル管理操作を実行
System.Shell.Item
System.Shell.RecycleBin
System.Sound
System.Time
  • システム時間情報を決定
System.Time.timeZone
  • System.Time.timeZone コレクションの各メンバー

プレゼンテーション オブジェクト

background
  • コンテンツおよびプロパティでガジェットの背景を宣言
image
  • ガジェットに表示するイメージ要素
text
  • ガジェットに表示するテキスト要素

サンプル

表示

gadget.xml
<?xml version="1.0" encoding="utf-8" ?>
<gadget>
  <name>WindowSidebarSample</name>
  <version>1.0.0.0</version>
  <hosts>
    <host name="sidebar">
      <base type="HTML" apiVersion="1.0.0" src="WindowSidebarSample.html" />
      <permissions>Full</permissions>
      <platform minPlatformVersion="1.0"/>
    </host>
  </hosts>
</gadget>
WindowSidebarSample.html
<html>
<head>
  <style type="text/css">
    body {
      /* ウィンドウサイズはBody要素に明示的に指定する */
      margin:0px;
      width:125px;  
      height:250px;
    }
  </style>
  <script type="text/jscript" language="jscript">
    function init() {
    }
  </script>
</head>
<body onload="init()">
  <!--
    ・ absolute を指定し、HTMLのレイアウトとは無関係に左上隅に配置
    ・ 後の要素が背景イメージの下に配置されないようにz-indexスタイルに-1を指定
    -->
  <g:background id="imgBackground" src="images/background.png" 
                style="position:absolute;z-index:-1;width:125px;height:250px;">
  </g:background>
</body
</html>
結果
  • ガジェットの一覧に表示された

1343 win sidebar01.jpg

  • 起動したところ

1344 win sidebar02.jpg

「https://www.typea.info/tips_/index.php?title=Windows_サイドバー_概要_～_ガジェットの表示&oldid=6791」から取得

© 2006 矢木浩人