TouchInstinct
/
TGPControls
312
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Merge branch 'jayliew-master' 

Close demo project now compiles #28
This commit is contained in:
Xavier Schott 2017-04-14 12:51:52 -07:00
parent c1020cef8f f9bc8a8d1f
commit f2828c42e3
3 changed files with 15 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
README.md
View File

@ -1,3 +1,6 @@
![Demo Project](TGPControlDemo.gif)
# Slider with _ticks_ & animated Label (Swift) # Slider with _ticks_ & animated Label (Swift)
TGPControls are drop-in replacement of `UISlider` & `UILabel`, with visual preview in **Interface Builder**, single liner instrumentation, smooth animations, simple API, powerful customization. TGPControls are drop-in replacement of `UISlider` & `UILabel`, with visual preview in **Interface Builder**, single liner instrumentation, smooth animations, simple API, powerful customization.
@ -16,7 +19,7 @@ Ideal to represent steps. *The discrete slider and the camel labels can work in
## Compatibility ## Compatibility
1. Written in **Swift 3**, can be integrated with **Swift** or **Obj-C** 1. Written in **Swift 3**, can be integrated with **Swift** or **Obj-C**
2. `TGPControls` are **AutoLayout**, `IB Designable` and `IB Inspectable` ready (†) 2. `TGPControls` are **AutoLayout**, `IB Designable` and `IB Inspectable` ready (†)
3. Version 3.0.0 comes with a **Swift 3** demo application, for **iOS 10** down to **8**. 3. Version 3.0.0 comes with a **Swift 3** demo application, for **iOS 10** down to **8**.
(†) Earlier 2.x versions provide **iOS 7** support (†) Earlier 2.x versions provide **iOS 7** support
![imagessliderdemo](https://cloud.githubusercontent.com/assets/4073988/6628373/183c7452-c8c2-11e4-9a63-107805bc0cc4.gif) ![imagessliderdemo](https://cloud.githubusercontent.com/assets/4073988/6628373/183c7452-c8c2-11e4-9a63-107805bc0cc4.gif)
@ -146,7 +149,7 @@ Most of the customization can be done inside **Interface Builder**.
| `offCenter` | **leftmost and righmost labels only**: relative inset expressed as a proportion of individual label width: 0: none, +0.5: nudge in by a half width (fully fit) or -0.5: draw completely outside | | `offCenter` | **leftmost and righmost labels only**: relative inset expressed as a proportion of individual label width: 0: none, +0.5: nudge in by a half width (fully fit) or -0.5: draw completely outside |
| `insets` | **leftmost and righmost labels only**: absolute inset expressed in pixels | | `insets` | **leftmost and righmost labels only**: absolute inset expressed in pixels |
| `emphasisLayout` | emphasized (_selected_) labels vertical alignment ; `.top`, `.centerY` or `.bottom`. Default is `.top` (†) | | `emphasisLayout` | emphasized (_selected_) labels vertical alignment ; `.top`, `.centerY` or `.bottom`. Default is `.top` (†) |
| `regularLayout` | regular labels vertical alignment ; `.top`, `.centerY` or `.bottom`. Default is `.bottom` (†) | | `regularLayout` | regular labels vertical alignment ; `.top`, `.centerY` or `.bottom`. Default is `.bottom` (†) |
(†) No camel animation will occur when `emphasisLayout` = `regularLayout`, i.e. `.centerY`. (†) No camel animation will occur when `emphasisLayout` = `regularLayout`, i.e. `.centerY`.

BIN
TGPControlDemo.gif Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 846 KiB

20
TGPControlsDemo/TGPControlsDemo/Base.lproj/Main.storyboard Normal file → Executable file
View File

@ -35,7 +35,7 @@
<color key="textColor" red="0.66666666666666663" green="0.66666666666666663" blue="0.66666666666666663" alpha="1" colorSpace="custom" customColorSpace="sRGB"/> <color key="textColor" red="0.66666666666666663" green="0.66666666666666663" blue="0.66666666666666663" alpha="1" colorSpace="custom" customColorSpace="sRGB"/>
<nil key="highlightedColor"/> <nil key="highlightedColor"/>
</label> </label>
<view contentMode="scaleToFill" translatesAutoresizingMaskIntoConstraints="NO" id="me6-ut-RSP" userLabel="oneTo10Labels" customClass="TGPCamelLabels" customModule="TGPControls"> <view contentMode="scaleToFill" translatesAutoresizingMaskIntoConstraints="NO" id="me6-ut-RSP" userLabel="oneTo10Labels" customClass="TGPCamelLabels">
<rect key="frame" x="16" y="48" width="343" height="40"/> <rect key="frame" x="16" y="48" width="343" height="40"/>
<color key="backgroundColor" red="0.0" green="0.0" blue="0.0" alpha="0.0" colorSpace="custom" customColorSpace="sRGB"/> <color key="backgroundColor" red="0.0" green="0.0" blue="0.0" alpha="0.0" colorSpace="custom" customColorSpace="sRGB"/>
<constraints> <constraints>
@ -67,7 +67,7 @@
</userDefinedRuntimeAttribute> </userDefinedRuntimeAttribute>
</userDefinedRuntimeAttributes> </userDefinedRuntimeAttributes>
</view> </view>
<view contentMode="scaleToFill" translatesAutoresizingMaskIntoConstraints="NO" id="ABG-DJ-HY6" userLabel="oneTo10Slider" customClass="TGPDiscreteSlider" customModule="TGPControls"> <view contentMode="scaleToFill" translatesAutoresizingMaskIntoConstraints="NO" id="ABG-DJ-HY6" userLabel="oneTo10Slider" customClass="TGPDiscreteSlider">
<rect key="frame" x="16" y="72" width="343" height="44"/> <rect key="frame" x="16" y="72" width="343" height="44"/>
<color key="backgroundColor" red="1" green="1" blue="1" alpha="0.0" colorSpace="custom" customColorSpace="sRGB"/> <color key="backgroundColor" red="1" green="1" blue="1" alpha="0.0" colorSpace="custom" customColorSpace="sRGB"/>
<color key="tintColor" red="1" green="0.0" blue="0.0" alpha="1" colorSpace="custom" customColorSpace="sRGB"/> <color key="tintColor" red="1" green="0.0" blue="0.0" alpha="1" colorSpace="custom" customColorSpace="sRGB"/>
@ -101,7 +101,7 @@
</userDefinedRuntimeAttribute> </userDefinedRuntimeAttribute>
</userDefinedRuntimeAttributes> </userDefinedRuntimeAttributes>
</view> </view>
<view contentMode="scaleToFill" translatesAutoresizingMaskIntoConstraints="NO" id="qEk-TU-odc" userLabel="pictureSlider" customClass="TGPDiscreteSlider" customModule="TGPControls"> <view contentMode="scaleToFill" translatesAutoresizingMaskIntoConstraints="NO" id="qEk-TU-odc" userLabel="pictureSlider" customClass="TGPDiscreteSlider">
<rect key="frame" x="37" y="155" width="300" height="21"/> <rect key="frame" x="37" y="155" width="300" height="21"/>
<color key="backgroundColor" red="0.0" green="0.0" blue="0.0" alpha="0.0" colorSpace="custom" customColorSpace="sRGB"/> <color key="backgroundColor" red="0.0" green="0.0" blue="0.0" alpha="0.0" colorSpace="custom" customColorSpace="sRGB"/>
<color key="tintColor" red="1" green="0.0" blue="0.0" alpha="1" colorSpace="custom" customColorSpace="sRGB"/> <color key="tintColor" red="1" green="0.0" blue="0.0" alpha="1" colorSpace="custom" customColorSpace="sRGB"/>
@ -139,7 +139,7 @@
<userDefinedRuntimeAttribute type="string" keyPath="trackImage" value="track"/> <userDefinedRuntimeAttribute type="string" keyPath="trackImage" value="track"/>
</userDefinedRuntimeAttributes> </userDefinedRuntimeAttributes>
</view> </view>
<view contentMode="scaleToFill" translatesAutoresizingMaskIntoConstraints="NO" id="Jca-ht-ahJ" userLabel="pictureLabels" customClass="TGPCamelLabels" customModule="TGPControls"> <view contentMode="scaleToFill" translatesAutoresizingMaskIntoConstraints="NO" id="Jca-ht-ahJ" userLabel="pictureLabels" customClass="TGPCamelLabels">
<rect key="frame" x="24" y="124" width="327" height="32"/> <rect key="frame" x="24" y="124" width="327" height="32"/>
<color key="backgroundColor" red="0.0" green="0.0" blue="0.0" alpha="0.0" colorSpace="custom" customColorSpace="sRGB"/> <color key="backgroundColor" red="0.0" green="0.0" blue="0.0" alpha="0.0" colorSpace="custom" customColorSpace="sRGB"/>
<constraints> <constraints>
@ -186,7 +186,7 @@
<color key="textColor" red="0.66666666666666663" green="0.66666666666666663" blue="0.66666666666666663" alpha="1" colorSpace="custom" customColorSpace="sRGB"/> <color key="textColor" red="0.66666666666666663" green="0.66666666666666663" blue="0.66666666666666663" alpha="1" colorSpace="custom" customColorSpace="sRGB"/>
<nil key="highlightedColor"/> <nil key="highlightedColor"/>
</label> </label>
<view contentMode="scaleToFill" translatesAutoresizingMaskIntoConstraints="NO" id="BhH-uE-SaH" userLabel="alphabetLabels" customClass="TGPCamelLabels" customModule="TGPControls"> <view contentMode="scaleToFill" translatesAutoresizingMaskIntoConstraints="NO" id="BhH-uE-SaH" userLabel="alphabetLabels" customClass="TGPCamelLabels">
<rect key="frame" x="16" y="248" width="343" height="40"/> <rect key="frame" x="16" y="248" width="343" height="40"/>
<color key="backgroundColor" red="0.0" green="0.0" blue="0.0" alpha="0.0" colorSpace="custom" customColorSpace="sRGB"/> <color key="backgroundColor" red="0.0" green="0.0" blue="0.0" alpha="0.0" colorSpace="custom" customColorSpace="sRGB"/>
<constraints> <constraints>
@ -218,7 +218,7 @@
</userDefinedRuntimeAttribute> </userDefinedRuntimeAttribute>
</userDefinedRuntimeAttributes> </userDefinedRuntimeAttributes>
</view> </view>
<view contentMode="scaleToFill" translatesAutoresizingMaskIntoConstraints="NO" id="hbc-OQ-ngs" userLabel="alphabetSlider" customClass="TGPDiscreteSlider" customModule="TGPControls"> <view contentMode="scaleToFill" translatesAutoresizingMaskIntoConstraints="NO" id="hbc-OQ-ngs" userLabel="alphabetSlider" customClass="TGPDiscreteSlider">
<rect key="frame" x="16" y="253" width="343" height="54"/> <rect key="frame" x="16" y="253" width="343" height="54"/>
<color key="backgroundColor" red="0.0" green="0.0" blue="0.0" alpha="0.0" colorSpace="custom" customColorSpace="sRGB"/> <color key="backgroundColor" red="0.0" green="0.0" blue="0.0" alpha="0.0" colorSpace="custom" customColorSpace="sRGB"/>
<constraints> <constraints>
@ -260,7 +260,7 @@
<color key="textColor" red="0.66666666666666663" green="0.66666666666666663" blue="0.66666666666666663" alpha="1" colorSpace="custom" customColorSpace="sRGB"/> <color key="textColor" red="0.66666666666666663" green="0.66666666666666663" blue="0.66666666666666663" alpha="1" colorSpace="custom" customColorSpace="sRGB"/>
<nil key="highlightedColor"/> <nil key="highlightedColor"/>
</label> </label>
<view contentMode="scaleToFill" translatesAutoresizingMaskIntoConstraints="NO" id="cr3-Gd-Hq6" userLabel="switch1Camel" customClass="TGPCamelLabels" customModule="TGPControls"> <view contentMode="scaleToFill" translatesAutoresizingMaskIntoConstraints="NO" id="cr3-Gd-Hq6" userLabel="switch1Camel" customClass="TGPCamelLabels">
<rect key="frame" x="99" y="380" width="49" height="18"/> <rect key="frame" x="99" y="380" width="49" height="18"/>
<color key="backgroundColor" red="0.0" green="0.0" blue="0.0" alpha="0.0" colorSpace="custom" customColorSpace="sRGB"/> <color key="backgroundColor" red="0.0" green="0.0" blue="0.0" alpha="0.0" colorSpace="custom" customColorSpace="sRGB"/>
<constraints> <constraints>
@ -305,7 +305,7 @@
<action selector="switch2TouchUpInside:" destination="BYZ-38-t0r" eventType="touchUpInside" id="0xh-oL-8NO"/> <action selector="switch2TouchUpInside:" destination="BYZ-38-t0r" eventType="touchUpInside" id="0xh-oL-8NO"/>
</connections> </connections>
</switch> </switch>
<view contentMode="scaleToFill" translatesAutoresizingMaskIntoConstraints="NO" id="Zr4-IE-ENv" userLabel="switch2Camel" customClass="TGPCamelLabels" customModule="TGPControls"> <view contentMode="scaleToFill" translatesAutoresizingMaskIntoConstraints="NO" id="Zr4-IE-ENv" userLabel="switch2Camel" customClass="TGPCamelLabels">
<rect key="frame" x="225" y="401" width="49" height="20"/> <rect key="frame" x="225" y="401" width="49" height="20"/>
<color key="backgroundColor" red="0.0" green="0.0" blue="0.0" alpha="0.0" colorSpace="custom" customColorSpace="sRGB"/> <color key="backgroundColor" red="0.0" green="0.0" blue="0.0" alpha="0.0" colorSpace="custom" customColorSpace="sRGB"/>
<constraints> <constraints>
@ -344,7 +344,7 @@
<color key="textColor" red="0.66666666666666663" green="0.66666666666666663" blue="0.66666666666666663" alpha="1" colorSpace="custom" customColorSpace="sRGB"/> <color key="textColor" red="0.66666666666666663" green="0.66666666666666663" blue="0.66666666666666663" alpha="1" colorSpace="custom" customColorSpace="sRGB"/>
<nil key="highlightedColor"/> <nil key="highlightedColor"/>
</label> </label>
<view contentMode="scaleToFill" translatesAutoresizingMaskIntoConstraints="NO" id="Ndg-v1-Tx3" userLabel="customSlider1" customClass="TGPDiscreteSlider" customModule="TGPControls"> <view contentMode="scaleToFill" translatesAutoresizingMaskIntoConstraints="NO" id="Ndg-v1-Tx3" userLabel="customSlider1" customClass="TGPDiscreteSlider">
<rect key="frame" x="16" y="551" width="343" height="44"/> <rect key="frame" x="16" y="551" width="343" height="44"/>
<color key="backgroundColor" red="0.0" green="0.0" blue="0.0" alpha="0.0" colorSpace="custom" customColorSpace="sRGB"/> <color key="backgroundColor" red="0.0" green="0.0" blue="0.0" alpha="0.0" colorSpace="custom" customColorSpace="sRGB"/>
<color key="tintColor" red="0.5" green="0.5" blue="0.5" alpha="0.46000000000000002" colorSpace="custom" customColorSpace="sRGB"/> <color key="tintColor" red="0.5" green="0.5" blue="0.5" alpha="0.46000000000000002" colorSpace="custom" customColorSpace="sRGB"/>
@ -393,7 +393,7 @@
<action selector="stepperValueChanged:" destination="BYZ-38-t0r" eventType="valueChanged" id="CZT-vS-FyY"/> <action selector="stepperValueChanged:" destination="BYZ-38-t0r" eventType="valueChanged" id="CZT-vS-FyY"/>
</connections> </connections>
</stepper> </stepper>
<view contentMode="scaleToFill" translatesAutoresizingMaskIntoConstraints="NO" id="QFe-pU-ocw" userLabel="customSlider4" customClass="TGPDiscreteSlider" customModule="TGPControls"> <view contentMode="scaleToFill" translatesAutoresizingMaskIntoConstraints="NO" id="QFe-pU-ocw" userLabel="customSlider4" customClass="TGPDiscreteSlider">
<rect key="frame" x="16" y="499" width="241" height="44"/> <rect key="frame" x="16" y="499" width="241" height="44"/>
<color key="backgroundColor" red="0.0" green="0.0" blue="0.0" alpha="0.0" colorSpace="custom" customColorSpace="sRGB"/> <color key="backgroundColor" red="0.0" green="0.0" blue="0.0" alpha="0.0" colorSpace="custom" customColorSpace="sRGB"/>
<constraints> <constraints>