Revamp Tutorial 2 UI to be more iOS-like, to be closer to what the Android one looks like, and to simplify development of next tutorials.

This commit is contained in:
Xavi Artigas 2013-05-07 10:30:31 +02:00
parent 5d747fb6be
commit 1214abe858
3 changed files with 71 additions and 142 deletions

View file

@ -3,8 +3,8 @@
@interface ViewController : UIViewController <GStreamerBackendDelegate> {
IBOutlet UILabel *message_label;
IBOutlet UIButton *play_button;
IBOutlet UIButton *pause_button;
IBOutlet UIBarButtonItem *play_button;
IBOutlet UIBarButtonItem *pause_button;
}
-(IBAction) play:(id)sender;

View file

@ -1,100 +1,64 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<document type="com.apple.InterfaceBuilder3.CocoaTouch.Storyboard.XIB" version="2.0" toolsVersion="3084" systemVersion="11G63" targetRuntime="iOS.CocoaTouch.iPad" propertyAccessControl="none" useAutolayout="YES" initialViewController="2">
<document type="com.apple.InterfaceBuilder3.CocoaTouch.Storyboard.XIB" version="2.0" toolsVersion="3084" systemVersion="11G63" targetRuntime="iOS.CocoaTouch.iPad" propertyAccessControl="none" useAutolayout="YES" initialViewController="z7O-8l-Zeo">
<dependencies>
<plugIn identifier="com.apple.InterfaceBuilder.IBCocoaTouchPlugin" version="2083"/>
</dependencies>
<scenes>
<!--View Controller-->
<scene sceneID="4">
<scene sceneID="P93-nn-HBJ">
<objects>
<viewController id="2" customClass="ViewController" sceneMemberID="viewController">
<view key="view" contentMode="scaleToFill" id="5">
<viewController id="z7O-8l-Zeo" customClass="ViewController" sceneMemberID="viewController">
<view key="view" contentMode="scaleToFill" id="CqS-Gu-I1O">
<rect key="frame" x="0.0" y="20" width="768" height="1004"/>
<autoresizingMask key="autoresizingMask" widthSizable="YES" heightSizable="YES"/>
<subviews>
<view contentMode="scaleToFill" translatesAutoresizingMaskIntoConstraints="NO" id="nMR-rP-TAZ" userLabel="Content">
<subviews>
<label opaque="NO" clipsSubviews="YES" userInteractionEnabled="NO" contentMode="left" text="Initializing..." textAlignment="center" lineBreakMode="wordWrap" numberOfLines="0" baselineAdjustment="alignBaselines" adjustsFontSizeToFit="NO" preferredMaxLayoutWidth="688" translatesAutoresizingMaskIntoConstraints="NO" id="UBA-ZM-cSe" userLabel="Message">
<fontDescription key="fontDescription" type="system" pointSize="24"/>
<color key="textColor" cocoaTouchSystemColor="darkTextColor"/>
<nil key="highlightedColor"/>
</label>
<button opaque="NO" contentMode="scaleToFill" contentHorizontalAlignment="center" contentVerticalAlignment="center" buttonType="roundedRect" lineBreakMode="middleTruncation" translatesAutoresizingMaskIntoConstraints="NO" id="elU-wp-Qp2" userLabel="Play">
<constraints>
<constraint firstAttribute="height" constant="100" type="user" id="4hh-98-fyR"/>
<constraint firstAttribute="width" constant="400" type="user" id="uTI-bm-bpQ"/>
</constraints>
<fontDescription key="fontDescription" type="boldSystem" pointSize="32"/>
<state key="normal" title="Play">
<color key="titleColor" red="0.19607843459999999" green="0.30980393290000002" blue="0.52156865600000002" alpha="1" colorSpace="calibratedRGB"/>
<color key="titleShadowColor" white="0.5" alpha="1" colorSpace="calibratedWhite"/>
</state>
<state key="disabled">
<color key="titleColor" white="0.66666666666666663" alpha="1" colorSpace="calibratedWhite"/>
</state>
<state key="highlighted">
<color key="titleColor" white="1" alpha="1" colorSpace="calibratedWhite"/>
</state>
<connections>
<action selector="play:" destination="2" eventType="touchUpInside" id="Rji-r8-PDd"/>
</connections>
</button>
<button opaque="NO" contentMode="scaleToFill" contentHorizontalAlignment="center" contentVerticalAlignment="center" buttonType="roundedRect" lineBreakMode="middleTruncation" translatesAutoresizingMaskIntoConstraints="NO" id="w2M-v5-UAa" userLabel="Pause">
<constraints>
<constraint firstAttribute="height" constant="100" type="user" id="L6h-G1-RwS"/>
<constraint firstAttribute="width" constant="400" type="user" id="S8q-2J-07k"/>
</constraints>
<fontDescription key="fontDescription" type="boldSystem" pointSize="32"/>
<state key="normal" title="Pause">
<color key="titleColor" red="0.19607843459999999" green="0.30980393290000002" blue="0.52156865600000002" alpha="1" colorSpace="calibratedRGB"/>
<color key="titleShadowColor" white="0.5" alpha="1" colorSpace="calibratedWhite"/>
</state>
<state key="disabled">
<color key="titleColor" white="0.66666666666666663" alpha="1" colorSpace="calibratedWhite"/>
</state>
<state key="highlighted">
<color key="titleColor" white="1" alpha="1" colorSpace="calibratedWhite"/>
</state>
<connections>
<action selector="pause:" destination="2" eventType="touchUpInside" id="zwv-tc-xE7"/>
</connections>
</button>
</subviews>
<color key="backgroundColor" white="1" alpha="1" colorSpace="calibratedWhite"/>
<label opaque="NO" clipsSubviews="YES" userInteractionEnabled="NO" contentMode="left" text="Initializing..." textAlignment="center" lineBreakMode="wordWrap" numberOfLines="0" baselineAdjustment="alignBaselines" adjustsFontSizeToFit="NO" preferredMaxLayoutWidth="728" translatesAutoresizingMaskIntoConstraints="NO" id="iLX-h1-Ko5" userLabel="Message">
<constraints>
<constraint firstItem="elU-wp-Qp2" firstAttribute="top" secondItem="UBA-ZM-cSe" secondAttribute="bottom" constant="8" symbolic="YES" type="user" id="18h-11-jhy"/>
<constraint firstItem="w2M-v5-UAa" firstAttribute="top" secondItem="elU-wp-Qp2" secondAttribute="bottom" constant="8" symbolic="YES" type="user" id="6GJ-37-EcB"/>
<constraint firstAttribute="centerX" secondItem="w2M-v5-UAa" secondAttribute="centerX" type="user" id="7jU-ts-TJx"/>
<constraint firstAttribute="trailing" secondItem="UBA-ZM-cSe" secondAttribute="trailing" constant="20" symbolic="YES" type="user" id="EkQ-sA-oVc"/>
<constraint firstAttribute="centerX" secondItem="elU-wp-Qp2" secondAttribute="centerX" type="user" id="EuX-Nw-e9K"/>
<constraint firstAttribute="bottom" secondItem="w2M-v5-UAa" secondAttribute="bottom" constant="20" symbolic="YES" type="default" id="LCr-Rv-UZs"/>
<constraint firstItem="UBA-ZM-cSe" firstAttribute="top" secondItem="nMR-rP-TAZ" secondAttribute="top" constant="20" symbolic="YES" type="user" id="nNG-sn-bRM"/>
<constraint firstItem="UBA-ZM-cSe" firstAttribute="leading" secondItem="nMR-rP-TAZ" secondAttribute="leading" constant="20" symbolic="YES" type="user" id="pJE-Vl-N8j"/>
<constraint firstAttribute="width" relation="greaterThanOrEqual" constant="50" type="user" id="7Z8-1b-Y41"/>
</constraints>
</view>
<fontDescription key="fontDescription" type="system" pointSize="16"/>
<color key="textColor" cocoaTouchSystemColor="darkTextColor"/>
<nil key="highlightedColor"/>
</label>
<toolbar opaque="NO" clearsContextBeforeDrawing="NO" contentMode="scaleToFill" translatesAutoresizingMaskIntoConstraints="NO" id="MUi-CE-Ydy">
<items>
<barButtonItem style="plain" systemItem="flexibleSpace" id="onU-hf-FS4"/>
<barButtonItem systemItem="play" id="UlF-Ga-2VX">
<connections>
<action selector="play:" destination="z7O-8l-Zeo" id="5xC-uv-9lM"/>
</connections>
</barButtonItem>
<barButtonItem systemItem="pause" id="J3O-8j-Tkt">
<connections>
<action selector="pause:" destination="z7O-8l-Zeo" id="BYM-2X-Tel"/>
</connections>
</barButtonItem>
<barButtonItem style="plain" systemItem="flexibleSpace" id="urI-U7-ALw"/>
</items>
</toolbar>
</subviews>
<color key="backgroundColor" white="1" alpha="1" colorSpace="custom" customColorSpace="calibratedWhite"/>
<constraints>
<constraint firstItem="nMR-rP-TAZ" firstAttribute="leading" secondItem="5" secondAttribute="leading" constant="20" symbolic="YES" type="user" id="E7n-88-e9Y"/>
<constraint firstAttribute="centerX" secondItem="nMR-rP-TAZ" secondAttribute="centerX" type="user" id="SAT-T4-FL2"/>
<constraint firstAttribute="centerY" secondItem="nMR-rP-TAZ" secondAttribute="centerY" type="user" id="SfA-hs-2KS"/>
<constraint firstItem="nMR-rP-TAZ" firstAttribute="top" secondItem="5" secondAttribute="top" priority="1" constant="20" symbolic="YES" type="user" id="XdK-Aa-fKA"/>
<constraint firstItem="iLX-h1-Ko5" firstAttribute="bottom" secondItem="MUi-CE-Ydy" secondAttribute="top" constant="8" symbolic="YES" type="user" id="FXP-eH-VSK"/>
<constraint firstItem="MUi-CE-Ydy" firstAttribute="leading" secondItem="CqS-Gu-I1O" secondAttribute="leading" constant="20" symbolic="YES" type="user" id="OM9-gE-OVP"/>
<constraint firstAttribute="trailing" secondItem="iLX-h1-Ko5" secondAttribute="trailing" constant="20" symbolic="YES" type="user" id="Xdr-12-E1r"/>
<constraint firstItem="iLX-h1-Ko5" firstAttribute="leading" secondItem="CqS-Gu-I1O" secondAttribute="leading" constant="20" symbolic="YES" type="user" id="bT2-TE-X7Q"/>
<constraint firstItem="MUi-CE-Ydy" firstAttribute="trailing" secondItem="CqS-Gu-I1O" secondAttribute="trailing" constant="20" symbolic="YES" type="user" id="iRT-XF-W0f"/>
<constraint firstItem="MUi-CE-Ydy" firstAttribute="bottom" secondItem="CqS-Gu-I1O" secondAttribute="bottom" constant="20" symbolic="YES" type="user" id="w6K-xy-EJe"/>
</constraints>
</view>
<simulatedStatusBarMetrics key="simulatedStatusBarMetrics" statusBarStyle="blackTranslucent"/>
<connections>
<outlet property="message_label" destination="UBA-ZM-cSe" id="o2e-1J-nKs"/>
<outlet property="pause_button" destination="w2M-v5-UAa" id="PKY-tN-Lod"/>
<outlet property="play_button" destination="elU-wp-Qp2" id="C54-Xz-aIt"/>
<outlet property="message_label" destination="iLX-h1-Ko5" id="Q0Y-3J-zis"/>
<outlet property="pause_button" destination="J3O-8j-Tkt" id="Dls-sg-FPm"/>
<outlet property="play_button" destination="UlF-Ga-2VX" id="243-yq-GEe"/>
</connections>
</viewController>
<placeholder placeholderIdentifier="IBFirstResponder" id="3" sceneMemberID="firstResponder"/>
<placeholder placeholderIdentifier="IBFirstResponder" id="iRS-GG-bR6" sceneMemberID="firstResponder"/>
</objects>
</scene>
</scenes>
<classes>
<class className="NSLayoutConstraint" superclassName="NSObject">
<source key="sourceIdentifier" type="project" relativePath="./Classes/NSLayoutConstraint.h"/>
</class>
<class className="ViewController" superclassName="UIViewController">
<source key="sourceIdentifier" type="project" relativePath="./Classes/ViewController.h"/>
<relationships>
@ -102,8 +66,8 @@
<relationship kind="action" name="play:"/>
<relationship kind="outlet" name="label" candidateClass="UILabel"/>
<relationship kind="outlet" name="message_label" candidateClass="UILabel"/>
<relationship kind="outlet" name="pause_button" candidateClass="UIButton"/>
<relationship kind="outlet" name="play_button" candidateClass="UIButton"/>
<relationship kind="outlet" name="pause_button" candidateClass="UIBarButtonItem"/>
<relationship kind="outlet" name="play_button" candidateClass="UIBarButtonItem"/>
</relationships>
</class>
</classes>

View file

@ -12,81 +12,46 @@
<rect key="frame" x="0.0" y="20" width="320" height="548"/>
<autoresizingMask key="autoresizingMask" widthSizable="YES" heightSizable="YES"/>
<subviews>
<view contentMode="scaleToFill" translatesAutoresizingMaskIntoConstraints="NO" id="pac-D3-jCF" userLabel="Content">
<subviews>
<label opaque="NO" clipsSubviews="YES" userInteractionEnabled="NO" contentMode="left" text="Initializing..." textAlignment="center" lineBreakMode="wordWrap" numberOfLines="0" baselineAdjustment="alignBaselines" adjustsFontSizeToFit="NO" preferredMaxLayoutWidth="240" translatesAutoresizingMaskIntoConstraints="NO" id="8wd-E5-Owx" userLabel="Message">
<fontDescription key="fontDescription" type="system" pointSize="16"/>
<color key="textColor" cocoaTouchSystemColor="darkTextColor"/>
<nil key="highlightedColor"/>
</label>
<button opaque="NO" contentMode="scaleToFill" enabled="NO" contentHorizontalAlignment="center" contentVerticalAlignment="center" buttonType="roundedRect" lineBreakMode="middleTruncation" translatesAutoresizingMaskIntoConstraints="NO" id="uVI-yQ-geg" userLabel="Play">
<constraints>
<constraint firstAttribute="height" constant="100" type="user" id="D1U-D7-pGb"/>
<constraint firstAttribute="width" constant="200" type="user" id="H9m-EA-1Y9"/>
</constraints>
<fontDescription key="fontDescription" type="boldSystem" pointSize="24"/>
<state key="normal" title="Play">
<color key="titleColor" red="0.19607843459999999" green="0.30980393290000002" blue="0.52156865600000002" alpha="1" colorSpace="calibratedRGB"/>
<color key="titleShadowColor" white="0.5" alpha="1" colorSpace="calibratedWhite"/>
</state>
<state key="disabled">
<color key="titleColor" white="0.66666666666666663" alpha="1" colorSpace="calibratedWhite"/>
</state>
<state key="highlighted">
<color key="titleColor" white="1" alpha="1" colorSpace="calibratedWhite"/>
</state>
<connections>
<action selector="play:" destination="kYn-Hr-MJq" eventType="touchUpInside" id="lem-QX-Nov"/>
</connections>
</button>
<button opaque="NO" contentMode="scaleToFill" enabled="NO" contentHorizontalAlignment="center" contentVerticalAlignment="center" buttonType="roundedRect" lineBreakMode="middleTruncation" translatesAutoresizingMaskIntoConstraints="NO" id="w5n-dd-01i" userLabel="Pause">
<constraints>
<constraint firstAttribute="height" constant="100" type="user" id="heT-S6-HPW"/>
<constraint firstAttribute="width" constant="200" type="user" id="zY8-bB-SYS"/>
</constraints>
<fontDescription key="fontDescription" type="boldSystem" pointSize="24"/>
<state key="normal" title="Pause">
<color key="titleColor" red="0.19607843459999999" green="0.30980393290000002" blue="0.52156865600000002" alpha="1" colorSpace="calibratedRGB"/>
<color key="titleShadowColor" white="0.5" alpha="1" colorSpace="calibratedWhite"/>
</state>
<state key="disabled">
<color key="titleColor" white="0.66666666666666663" alpha="1" colorSpace="calibratedWhite"/>
</state>
<state key="highlighted">
<color key="titleColor" white="1" alpha="1" colorSpace="calibratedWhite"/>
</state>
<connections>
<action selector="pause:" destination="kYn-Hr-MJq" eventType="touchUpInside" id="eZ6-M4-XBq"/>
</connections>
</button>
</subviews>
<color key="backgroundColor" white="1" alpha="1" colorSpace="calibratedWhite"/>
<label opaque="NO" clipsSubviews="YES" userInteractionEnabled="NO" contentMode="left" text="Initializing..." textAlignment="center" lineBreakMode="wordWrap" numberOfLines="0" baselineAdjustment="alignBaselines" adjustsFontSizeToFit="NO" preferredMaxLayoutWidth="280" translatesAutoresizingMaskIntoConstraints="NO" id="8wd-E5-Owx" userLabel="Message">
<constraints>
<constraint firstAttribute="centerX" secondItem="uVI-yQ-geg" secondAttribute="centerX" type="user" id="2Wc-AU-tx5"/>
<constraint firstItem="8wd-E5-Owx" firstAttribute="leading" secondItem="pac-D3-jCF" secondAttribute="leading" constant="20" symbolic="YES" type="user" id="3rd-sw-9RW"/>
<constraint firstAttribute="centerX" secondItem="w5n-dd-01i" secondAttribute="centerX" type="user" id="3se-ej-QVc"/>
<constraint firstAttribute="trailing" secondItem="8wd-E5-Owx" secondAttribute="trailing" constant="20" symbolic="YES" type="user" id="FyO-Cv-ZON"/>
<constraint firstItem="uVI-yQ-geg" firstAttribute="top" secondItem="8wd-E5-Owx" secondAttribute="bottom" constant="8" symbolic="YES" type="user" id="Lte-nX-y3p"/>
<constraint firstItem="w5n-dd-01i" firstAttribute="top" secondItem="uVI-yQ-geg" secondAttribute="bottom" constant="8" symbolic="YES" type="user" id="Tqh-LF-05e"/>
<constraint firstItem="8wd-E5-Owx" firstAttribute="top" secondItem="pac-D3-jCF" secondAttribute="top" constant="20" symbolic="YES" type="user" id="dXW-gd-gnP"/>
<constraint firstAttribute="bottom" secondItem="w5n-dd-01i" secondAttribute="bottom" constant="20" symbolic="YES" type="default" id="dbq-X8-9Im"/>
<constraint firstAttribute="width" relation="greaterThanOrEqual" constant="50" type="user" id="WIW-Im-XnF"/>
</constraints>
</view>
<fontDescription key="fontDescription" type="system" pointSize="16"/>
<color key="textColor" cocoaTouchSystemColor="darkTextColor"/>
<nil key="highlightedColor"/>
</label>
<toolbar opaque="NO" clearsContextBeforeDrawing="NO" contentMode="scaleToFill" translatesAutoresizingMaskIntoConstraints="NO" id="o22-1p-nvT">
<items>
<barButtonItem style="plain" systemItem="flexibleSpace" id="BPU-1t-gy3"/>
<barButtonItem systemItem="play" id="6LZ-7a-xKf">
<connections>
<action selector="play:" destination="kYn-Hr-MJq" id="hIx-MW-CFA"/>
</connections>
</barButtonItem>
<barButtonItem systemItem="pause" id="bfY-YY-jiu">
<connections>
<action selector="pause:" destination="kYn-Hr-MJq" id="dQ5-mO-cMh"/>
</connections>
</barButtonItem>
<barButtonItem style="plain" systemItem="flexibleSpace" id="hSc-4x-myS"/>
</items>
</toolbar>
</subviews>
<color key="backgroundColor" white="1" alpha="1" colorSpace="custom" customColorSpace="calibratedWhite"/>
<constraints>
<constraint firstItem="pac-D3-jCF" firstAttribute="top" secondItem="JOS-rK-Hts" secondAttribute="top" priority="1" constant="20" symbolic="YES" type="user" id="77r-Ci-q9w"/>
<constraint firstItem="pac-D3-jCF" firstAttribute="top" secondItem="JOS-rK-Hts" secondAttribute="top" priority="1" constant="20" symbolic="YES" type="user" id="MGJ-u0-MAG"/>
<constraint firstAttribute="centerX" secondItem="pac-D3-jCF" secondAttribute="centerX" type="user" id="Y2t-0q-fAJ"/>
<constraint firstItem="pac-D3-jCF" firstAttribute="leading" secondItem="JOS-rK-Hts" secondAttribute="leading" constant="20" symbolic="YES" type="user" id="dPX-1l-W4G"/>
<constraint firstAttribute="centerY" secondItem="pac-D3-jCF" secondAttribute="centerY" type="user" id="pxX-Qj-nAV"/>
<constraint firstItem="8wd-E5-Owx" firstAttribute="bottom" secondItem="o22-1p-nvT" secondAttribute="top" constant="8" symbolic="YES" type="user" id="CHF-CI-6CL"/>
<constraint firstAttribute="trailing" secondItem="8wd-E5-Owx" secondAttribute="trailing" constant="20" symbolic="YES" type="user" id="WDw-jT-tbz"/>
<constraint firstItem="o22-1p-nvT" firstAttribute="leading" secondItem="JOS-rK-Hts" secondAttribute="leading" constant="20" symbolic="YES" type="user" id="Zvb-2h-v7A"/>
<constraint firstItem="o22-1p-nvT" firstAttribute="bottom" secondItem="JOS-rK-Hts" secondAttribute="bottom" constant="20" symbolic="YES" type="user" id="l3D-e3-Z7R"/>
<constraint firstItem="8wd-E5-Owx" firstAttribute="leading" secondItem="JOS-rK-Hts" secondAttribute="leading" constant="20" symbolic="YES" type="user" id="lwj-ty-IXl"/>
<constraint firstItem="o22-1p-nvT" firstAttribute="trailing" secondItem="JOS-rK-Hts" secondAttribute="trailing" constant="20" symbolic="YES" type="user" id="mL0-QH-ra6"/>
</constraints>
</view>
<simulatedStatusBarMetrics key="simulatedStatusBarMetrics"/>
<connections>
<outlet property="message_label" destination="8wd-E5-Owx" id="7Xw-cg-3hH"/>
<outlet property="pause_button" destination="w5n-dd-01i" id="lHm-u3-mcA"/>
<outlet property="play_button" destination="uVI-yQ-geg" id="vI5-ma-lhA"/>
<outlet property="pause_button" destination="bfY-YY-jiu" id="GBf-vm-mbR"/>
<outlet property="play_button" destination="6LZ-7a-xKf" id="Tk2-4w-9Px"/>
</connections>
</viewController>
<placeholder placeholderIdentifier="IBFirstResponder" id="25z-hu-OZW" sceneMemberID="firstResponder"/>