--- /dev/null
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
+<head>
+ <meta http-equiv="content-type" content="text/html; charset=utf-8"/>
+ <meta http-equiv="X-UA-Compatible" content="IE=9" />
+ <link rel="stylesheet" type="text/css" href="../css/styles.css" />
+ <link rel="stylesheet" type="text/css" href="../css/snippet.css" />
+ <script type="text/javascript" src="../scripts/snippet.js"></script>
+ <script type="text/javascript" src="../scripts/jquery.util.js" charset="utf-8"></script>
+ <script type="text/javascript" src="../scripts/common.js" charset="utf-8"></script>
+ <script type="text/javascript" src="../scripts/core.js" charset="utf-8"></script>
+ <script type="text/javascript" src="../scripts/search.js" charset="utf-8"></script>
+ <title>Attach Panel</title>
+ </head>
+ <body onload="prettyPrint()" style="overflow: auto;">
+
+ <div id="toc-navigation">
+
+ <div id="toc_border"><div id="toc">
+ <p class="toc-title">Dependencies</p>
+ <ul class="toc">
+ <li>Tizen 4.0 and Higher</li>
+ </ul>
+ <p class="toc-title">Content</p>
+ <ul class="toc">
+ <li><a href="#categories">Content Categories</a></li>
+ <li><a href="#prerequisites">Prerequisites</a></li>
+ <li><a href="#create">Creating an Attach Panel</a></li>
+ <li><a href="#manage">Managing an Attach Panel</a></li>
+ </ul>
+ <p class="toc-title">Related Info</p>
+ <ul class="toc">
+ <li><a href="https://developer.tizen.org/dev-guide/csapi/namespaceTizen_1_1Applications_1_1AttachPanel.html">Tizen.Applications.AttachPanel Namespace</a></li>
+ </ul>
+ </div></div>
+</div>
+
+<div id="container"><div id="contents"><div class="content">
+ <h1>Attach Panel</h1>
+
+<p>The attach panel allows the device user to attach various content into an application that contains an attach panel. The user can attach images, take pictures, record voice, and select files on the attach panel.</p>
+
+<p>The main features of the Tizen.Applications.AttachPanel namespace include:</p>
+<ul>
+<li>Creating an attach panel
+<p>You can <a href="#create">create an attach panel</a> and manage events related to user selections and panel visibility. You can also add and remove <a href="#categories">content categories</a>.</p></li>
+<li>Managing an attach panel
+<p>You can <a href="#manage">set extra data</a> to a content category to manage its content.</p></li>
+</ul>
+
+<p align="center"><strong>Figure: Attach panel</strong></p>
+<p align="center"><img alt="Attach panel" src="../images/attach_panel_area.png" /></p>
+
+<p>The attach panel has UI components and it manages user interactions on its interface. The layout component keeps on the tabbar and scroller components, which are connected to show the content synchronously. The scroller component has pages to display the content of, for example, images, camera, and voice recorder. Some content is shown as a page on the panel, while others can be launched from the panel's <strong>More</strong> tab using <a href="app_controls.htm">application controls</a>.</p>
+
+<p>The attach panel has half and full display modes. The mode can be changed by swiping up and down the page.</p>
+<p align="center"><strong>Figure: Attach panel modes</strong></p>
+<p align="center"><img alt="Attach panel modes" src="../images/attach_mode.png" /></p>
+
+<h2 id="categories">Content Categories</h2>
+
+<p>You can manage the following types of content:</p>
+<ul>
+<li>Images
+<p>In the half mode, you can select only 1 image to be attached. In the full mode, you can select multiple images at once.</p>
+
+</li>
+<li>Camera
+<p>You can take a picture using the device camera, and attach it.</p>
+</li>
+<li>Voice
+<p>You can attach a voice recording.</p>
+</li>
+<li>Various content in the <strong>More</strong> tab
+<p>The <strong>More</strong> tab shows the icons of additional categories, for example, video, audio, calendar, contact, myfiles, and video recorder, that can be launched by clicking the applicable icon.</p>
+</li>
+</ul>
+
+<p>The following figure illustrates the content types. From left to right: images, camera, voice, and <strong>More</strong> tab content.</p>
+<p align="center"><strong>Figure: Content categories</strong></p>
+<p align="center"><img alt="Images content" src="../images/attach_images.png" /> <img alt="Camera content" src="../images/attach_camera.png" /> <img alt="Voice content" src="../images/attach_voice.png" /> <img alt="More content" src="../images/attach_more.png" /></p>
+
+
+<h2 id="prerequisites">Prerequisites</h2>
+
+<p>To enable your application to use the attach panel functionality:</p>
+<ol>
+<li>
+<p>To use the <a href="https://developer.tizen.org/dev-guide/csapi/namespaceTizen_1_1Applications_1_1AttachPanel.html">Tizen.Applications.AttachPanel</a> namespace, the application has to request permission by adding the following privileges to the <code>tizen-manifest.xml</code> file:</p>
+<pre class="prettyprint">
+<privileges>
+ <!--To add the image viewer and camera UI gadget in the attach panel-->
+ <privilege>http://tizen.org/privilege/mediastorage</privilege>
+ <!--To add the camera UI gadget in the attach panel-->
+ <privilege>http://tizen.org/privilege/camera</privilege>
+ <!--To add the voice recorder UI gadget in the attach panel-->
+ <privilege>http://tizen.org/privilege/recorder</privilege>
+ <!--To launch apps from the More tab-->
+ <privilege>http://tizen.org/privilege/appmanager.launch</privilege>
+</privileges>
+</pre>
+</li>
+<li>
+<p>To use the methods and properties of the Tizen.Applications.AttachPanel namespace, include it in your application:</p>
+<pre class="prettyprint">
+using Tizen.Applications.AttachPanel;
+</pre>
+</li>
+<li>
+<p>Create a conformant, into which you can add an attach panel instance later:</p>
+
+<pre class="prettyprint">
+class App : CoreUIApplication
+{
+ Conformant conformant;
+
+ protected override void OnCreate()
+ {
+ /// Application initialization
+
+ conformant = new Conformant(window);
+ conformant.Show();
+ conformant.SetContent(bg);
+
+ /// Create an attach panel
+ }
+}
+</pre>
+</li>
+</ol>
+
+ <h2 id="create" name="create">Creating an Attach Panel</h2>
+
+ <p>To create an attach panel:</p>
+
+<ol>
+<li>Create an attach panel using the <a href="https://developer.tizen.org/dev-guide/csapi/classTizen_1_1Applications_1_1AttachPanel_1_1AttachPanel.html">Tizen.Applications.AttachPanel.AttachPanel</a> class.
+<p>When the attach panel is created, its state is hidden by default. To show the created panel, use the <code>Show()</code> method of the <code>Tizen.Applications.AttachPanel.AttachPanel</code> class.</p>
+
+<pre class="prettyprint">
+AttachPanel attachPanel;
+
+public void CreateAttachPanel(Conformant conformant)
+{
+ if (attachPanel == null)
+ {
+ attachPanel = new AttachPanel(conformant);
+ attachPanel.AddCategory(ContentCategory.Image, null);
+ attachPanel.Show();
+ }
+}
+</pre>
+</li>
+<li>Based on the type of content you want the user to be able to select for the attach panel, add content categories using the <code>addCategory()</code> method. The available content categories are defined in the <code>Tizen.Applications.AttachPanel.ContentCategory</code> enumeration.
+<p>The content categories in the <strong>More</strong> tab are shown in the frequency, recently used, and alphabetical sequence.</p>
+<p>To deliver more information to the UI gadget or called application, add the data with a bundle.</p>
+
+<pre class="prettyprint">
+Bundle bundle = new Bundle();
+bundle.AddItem("http://tizen.org/appcontrol/data/total_count", "3");
+
+attachPanel.AddCategory(ContentCategory.Image, bundle);
+
+attachPanel.AddCategory(ContentCategory.Camera, null);
+attachPanel.AddCategory(ContentCategory.Voice, null);
+attachPanel.AddCategory(ContentCategory.Video, null);
+attachPanel.AddCategory(ContentCategory.Audio, null);
+attachPanel.AddCategory(ContentCategory.Calendar, null);
+attachPanel.AddCategory(ContentCategory.Contact, null);
+attachPanel.AddCategory(ContentCategory.Myfiles, null);
+attachPanel.AddCategory(ContentCategory.VideoRecorder, null);
+attachPanel.AddCategory(ContentCategory.Document, null);
+attachPanel.AddCategory(ContentCategory.TakePicture, null);
+attachPanel.AddCategory(ContentCategory.Memo, null);
+
+attachPanel.Show();
+</pre>
+</li>
+<li>Register the needed event handlers:
+
+<ul><li>To access the data that the user selects in the called application, register the <code>ResultCallback</code> event of the <code>Tizen.Applications.AttachPanel.AttachPanel</code> class and define an event handler for it.
+<p>The event is triggered when the user selects and confirms something to attach on the caller application. In the event handler, you can retrieve the selected items with <code>Tizen.Applications.AttachPanel.ResultEventArgs.Result.ExtraData</code>.</p></li>
+<li>To monitor published events from the panel side, register the <code>EventChanged</code> event of the <code>Tizen.Applications.AttachPanel.AttachPanel</code> class and define an event handler for it.
+<p>The event is triggered when reserved events (defined in the <code>Tizen.Applications.AttachPanel.StateEventArgs.EventType</code> enumeration) are published from the panel side.</p></li></ul>
+
+<pre class="prettyprint">
+private void AttachPanelResultCallback(object sender, ResultEventArgs e)
+{
+ if (e.ResultCode != AppControlReplyResult.Succeeded)
+ {
+ /// Error handling
+
+ return;
+ }
+
+ IEnumerable<string> selectedItems;
+ if (e.Result.ExtraData.TryGet("http://tizen.org/appcontrol/data/selected", out selectedItems))
+ {
+ foreach (var item in selectedItems)
+ {
+ Tizen.Log.Debug("AttachPanelTest", $"Selected content type is {e.Category}, selected item is {item}");
+ }
+ }
+ else
+ {
+ /// Error handling
+ }
+}
+
+private void AttachPanelEventChanged(object sender, StateEventArgs e)
+{
+ switch (e.EventType)
+ {
+ case EventType.ShowStart:
+ /// Attach panel showing starts
+ break;
+ case EventType.ShowFinish:
+ /// Attach panel showing ends
+ break;
+ case EventType.HideStart:
+ /// Attach panel hiding starts
+ break;
+ case EventType.HideFinish:
+ /// Attach panel hiding ends
+ break;
+ }
+}
+
+attachPanel.ResultCallback += AttachPanelResultCallback;
+attachPanel.EventChanged += AttachPanelEventChanged;
+</pre>
+</li>
+<li>When no longer needed, you can remove a specific content category by using the <code>RemoveCategory()</code> method:
+
+<pre class="prettyprint">
+public void RemoveCategory()
+{
+ attachPanel.RemoveCategory(ContentCategory.Image);
+ attachPanel.RemoveCategory(ContentCategory.Camera);
+}
+</pre>
+</li>
+</ol>
+
+
+ <h2 id="manage" name="manage">Managing an Attach Panel</h2>
+
+
+<p>To manage an attach panel content, you can set extra data to a previously-added content category through a bundle. Use the <code>SetExtraData()</code> method of the <a href="https://developer.tizen.org/dev-guide/csapi/classTizen_1_1Applications_1_1AttachPanel_1_1AttachPanel.html">Tizen.Applications.AttachPanel.AttachPanel</a> class.</p>
+
+
+The following extra data is supported:
+<ul>
+ <li><code>http://tizen.org/appcontrol/data/total_count</code>: Total count of selected items in the Images category</li>
+ <li><code>http://tizen.org/appcontrol/data/total_size</code>: Total size of selected items in the VideoRecorder category within the <strong>More</strong> tab</li>
+</ul>
+<pre class="prettyprint">
+public void SetTotalCountOfSelectedImages()
+{
+ Bundle bundle = new Bundle();
+ bundle.AddItem("http://tizen.org/appcontrol/data/total_count", "3");
+
+ attachPanel.SetExtraData(ContentCategory.Image, bundle);
+}
+
+public void SetTotalSizeOfSelectedItems()
+{
+ Bundle bundle = new Bundle();
+ bundle.AddItem("http://tizen.org/appcontrol/data/total_size", "200000");
+
+ attachPanel.SetExtraData(ContentCategory.VideoRecorder, bundle);
+}
+</pre>
+
+
+<script type="text/javascript" src="../scripts/jquery.zclip.min.js"></script>
+<script type="text/javascript" src="../scripts/showhide.js"></script>
+</div></div></div>
+
+<a class="top sms" href="#"><img src="../images/btn_top.gif" alt="Go to top" /></a>
+
+<div id="footer">
+<p class="footer">Except as noted, this content - excluding the Code Examples - is licensed under <a href="http://creativecommons.org/licenses/by/3.0/legalcode" target="_blank">Creative Commons Attribution 3.0</a> and all of the Code Examples contained herein are licensed under <a href="https://www.tizen.org/bsd-3-clause-license" target="_blank">BSD-3-Clause</a>.<br/>For details, see the <a href="https://www.tizen.org/content-license" target="_blank">Content License</a>.</p>
+</div>
+
+<script type="text/javascript">
+var _gaq = _gaq || [];
+_gaq.push(['_setAccount', 'UA-25976949-1']);
+_gaq.push(['_trackPageview']);
+(function() {
+var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
+ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
+var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
+})();
+</script>
+
+</body>
+</html>
projects / sdk / online-doc.git / commitdiff