{"id":4098,"date":"2010-02-15T15:33:39","date_gmt":"2010-02-15T10:03:39","guid":{"rendered":"http:\/\/mobisoftinfotech.com\/?p=4098"},"modified":"2024-11-18T15:58:44","modified_gmt":"2024-11-18T10:28:44","slug":"iphone-slider-control-uislider-control-tutorial","status":"publish","type":"post","link":"https:\/\/mobisoftinfotech.com\/resources\/blog\/iphone\/iphone-slider-control-uislider-control-tutorial","title":{"rendered":"iPhone Slider Control: UISlider Control Tutorial"},"content":{"rendered":"

Slider is a horizontal bar with a slider button which can slide along the bar’s length. The value of the slider changes according to the position of the slider button and this value can be displayed on a label beside the slider. This is precisely what we are going to do in this tutorial.<\/p>\n

Slider can be used as a value setter for a particular object such as a volume control.<\/p>\n

Step 1: Start Xcode and create a view based application<\/a> with name \u201cSliderDemo\u201d.<\/p>\n

Step 2: Open \u201cSliderDemoViewController.h\u201d and put the following code in it.<\/p>\n

[objc highlight=\"2,6,8\"]\n @interface SliderDemoViewController : UIViewController {\n\t\t\tUILabel *sliderLabel;\n\n}\n\n@property (nonatomic,retain) IBOutlet UILabel *sliderLabel;\n\n-(IBAction) sliderChanged:(id) sender;\n\n@end\n[\/objc]<\/pre>\n
Put the following code in the \u201cSliderDemoViewController.m\u201d file.<\/p>\n
[objc highlight=\"2,5,9, 10,11,12,13,14,15,16\"]\n@implementation SliderDemoViewController\n@synthesize sliderLabel;\n\n- (void)dealloc {\n\t[sliderLabel release];\n    \t[super dealloc];\n}\n\n-(IBAction) sliderChanged:(id) sender{\n\tUISlider *slider = (UISlider *) sender;\n\tint progressAsInt =(int)(slider.value + 0.5f);\n\tNSString *newText =[[NSString alloc]\n                  initWithFormat:@&amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;quot;%d&amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;quot;,progressAsInt];\n  self.sliderLabel.text = newText;\n\t[newText release];\n}\n\n@end\n[\/objc]<\/pre>\n
Here, in the sliderChanged method, we have declared an object of type slider. The variable progressAsInt has been used to store the slider’s position.0.5f is added to the slider value to round it off. We then put the value of progressAsInt in a string and set it as the label’s text.<\/p>\n
Step 3: Save(command+s) the project. Now open the \u201cSliderDemoViewController.xib\u201d file from the Resources folder. Add a slider and a label beside it to the view as shown below.
\nSliderDemoViewController.xib<\/strong><\/p>\n
Open the Attributes Inspector for slider.Set the fields under Values as Minimum = 1,Maximum = 100 and Initial = 50.<\/p>\n
Step 4: Open the Connections Inspector(command+2) for slider. Connect the value changed link to the sliderChanged method in File’s Owner. Also connect the label to sliderLabel in the File’s Owner.<\/p>\n
Step 5: Save,build and run the project. Now as you slide the slider button, the value displayed by the label changes.<\/p>\n
You can download the source code here<\/a>.<\/p>\n
OUTPUT:
\nOutput for SliderDemo<\/strong><\/p>\n
Thats the end of the tutorial folks. You are now ready to dabble with your own version of slider.<\/p>\n","protected":false},"excerpt":{"rendered":"
Slider is a horizontal bar with a slider button which can slide along the bar’s length. The value of the slider changes according to the position of the slider button and this value can be displayed on a label beside the slider. This is precisely what we are going to do in this tutorial. Slider […]<\/p>\n","protected":false},"author":13,"featured_media":0,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_s2mail":"yes","footnotes":""},"categories":[3],"tags":[56,328,54,55],"class_list":["post-4098","post","type-post","status-publish","format-standard","hentry","category-iphone","tag-iphone-slider-control","tag-iphone-ipad","tag-slider","tag-uislider-control"],"yoast_head":"\niPhone Slider Control: UISlider Control Tutorial - Mobisoft Infotech<\/title>\n<meta name=\"description\" content=\"Slider is a horizontal bar with a slider button which can slide along the bar\u2019s length.Learn more on iPhone Slider Control: UISlider Control.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/mobisoftinfotech.com\/resources\/blog\/iphone\/iphone-slider-control-uislider-control-tutorial\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"iPhone Slider Control: UISlider Control Tutorial - Mobisoft Infotech\" \/>\n<meta property=\"og:description\" content=\"Slider is a horizontal bar with a slider button which can slide along the bar\u2019s length.Learn more on iPhone Slider Control: UISlider Control.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/mobisoftinfotech.com\/resources\/blog\/iphone\/iphone-slider-control-uislider-control-tutorial\" \/>\n<meta property=\"og:site_name\" content=\"Mobisoft Infotech\" \/>\n<meta property=\"article:published_time\" content=\"2010-02-15T10:03:39+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2024-11-18T10:28:44+00:00\" \/>\n<meta name=\"author\" content=\"Ruchi Raval\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Ruchi Raval\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"2 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\/\/mobisoftinfotech.com\/resources\/blog\/iphone\/iphone-slider-control-uislider-control-tutorial#article\",\"isPartOf\":{\"@id\":\"https:\/\/mobisoftinfotech.com\/resources\/blog\/iphone\/iphone-slider-control-uislider-control-tutorial\"},\"author\":{\"name\":\"Ruchi Raval\",\"@id\":\"https:\/\/mobisoftinfotech.com\/resources\/#\/schema\/person\/6975ec0e158682ee8e5f4fbd7221b932\"},\"headline\":\"iPhone Slider Control: UISlider Control Tutorial\",\"datePublished\":\"2010-02-15T10:03:39+00:00\",\"dateModified\":\"2024-11-18T10:28:44+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/mobisoftinfotech.com\/resources\/blog\/iphone\/iphone-slider-control-uislider-control-tutorial\"},\"wordCount\":295,\"commentCount\":0,\"keywords\":[\"iPhone Slider Control\",\"iPhone \u2013 iPad\",\"Slider\",\"UISlider Control\"],\"articleSection\":[\"iPhone - iPad\"],\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\/\/mobisoftinfotech.com\/resources\/blog\/iphone\/iphone-slider-control-uislider-control-tutorial#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/mobisoftinfotech.com\/resources\/blog\/iphone\/iphone-slider-control-uislider-control-tutorial\",\"url\":\"https:\/\/mobisoftinfotech.com\/resources\/blog\/iphone\/iphone-slider-control-uislider-control-tutorial\",\"name\":\"iPhone Slider Control: UISlider Control Tutorial - Mobisoft Infotech\",\"isPartOf\":{\"@id\":\"https:\/\/mobisoftinfotech.com\/resources\/#website\"},\"datePublished\":\"2010-02-15T10:03:39+00:00\",\"dateModified\":\"2024-11-18T10:28:44+00:00\",\"author\":{\"@id\":\"https:\/\/mobisoftinfotech.com\/resources\/#\/schema\/person\/6975ec0e158682ee8e5f4fbd7221b932\"},\"description\":\"Slider is a horizontal bar with a slider button which can slide along the bar\u2019s length.Learn more on iPhone Slider Control: UISlider Control.\",\"breadcrumb\":{\"@id\":\"https:\/\/mobisoftinfotech.com\/resources\/blog\/iphone\/iphone-slider-control-uislider-control-tutorial#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/mobisoftinfotech.com\/resources\/blog\/iphone\/iphone-slider-control-uislider-control-tutorial\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/mobisoftinfotech.com\/resources\/blog\/iphone\/iphone-slider-control-uislider-control-tutorial#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/mobisoftinfotech.com\/resources\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"iPhone Slider Control: UISlider Control Tutorial\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/mobisoftinfotech.com\/resources\/#website\",\"url\":\"https:\/\/mobisoftinfotech.com\/resources\/\",\"name\":\"Mobisoft Infotech\",\"description\":\"Discover Mobility\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/mobisoftinfotech.com\/resources\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Person\",\"@id\":\"https:\/\/mobisoftinfotech.com\/resources\/#\/schema\/person\/6975ec0e158682ee8e5f4fbd7221b932\",\"name\":\"Ruchi Raval\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/secure.gravatar.com\/avatar\/c48187f401d31f2a08585cb66b4503c90f0586889e7212ae0680cd4edcb9910e?s=96&r=g\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/c48187f401d31f2a08585cb66b4503c90f0586889e7212ae0680cd4edcb9910e?s=96&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/c48187f401d31f2a08585cb66b4503c90f0586889e7212ae0680cd4edcb9910e?s=96&r=g\",\"caption\":\"Ruchi Raval\"},\"sameAs\":[\"http:\/\/www.mobisoftinfotech.com\"]}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"iPhone Slider Control: UISlider Control Tutorial - Mobisoft Infotech","description":"Slider is a horizontal bar with a slider button which can slide along the bar\u2019s length.Learn more on iPhone Slider Control: UISlider Control.","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/mobisoftinfotech.com\/resources\/blog\/iphone\/iphone-slider-control-uislider-control-tutorial","og_locale":"en_US","og_type":"article","og_title":"iPhone Slider Control: UISlider Control Tutorial - Mobisoft Infotech","og_description":"Slider is a horizontal bar with a slider button which can slide along the bar\u2019s length.Learn more on iPhone Slider Control: UISlider Control.","og_url":"https:\/\/mobisoftinfotech.com\/resources\/blog\/iphone\/iphone-slider-control-uislider-control-tutorial","og_site_name":"Mobisoft Infotech","article_published_time":"2010-02-15T10:03:39+00:00","article_modified_time":"2024-11-18T10:28:44+00:00","author":"Ruchi Raval","twitter_card":"summary_large_image","twitter_misc":{"Written by":"Ruchi Raval","Est. reading time":"2 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/mobisoftinfotech.com\/resources\/blog\/iphone\/iphone-slider-control-uislider-control-tutorial#article","isPartOf":{"@id":"https:\/\/mobisoftinfotech.com\/resources\/blog\/iphone\/iphone-slider-control-uislider-control-tutorial"},"author":{"name":"Ruchi Raval","@id":"https:\/\/mobisoftinfotech.com\/resources\/#\/schema\/person\/6975ec0e158682ee8e5f4fbd7221b932"},"headline":"iPhone Slider Control: UISlider Control Tutorial","datePublished":"2010-02-15T10:03:39+00:00","dateModified":"2024-11-18T10:28:44+00:00","mainEntityOfPage":{"@id":"https:\/\/mobisoftinfotech.com\/resources\/blog\/iphone\/iphone-slider-control-uislider-control-tutorial"},"wordCount":295,"commentCount":0,"keywords":["iPhone Slider Control","iPhone \u2013 iPad","Slider","UISlider Control"],"articleSection":["iPhone - iPad"],"inLanguage":"en-US","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/mobisoftinfotech.com\/resources\/blog\/iphone\/iphone-slider-control-uislider-control-tutorial#respond"]}]},{"@type":"WebPage","@id":"https:\/\/mobisoftinfotech.com\/resources\/blog\/iphone\/iphone-slider-control-uislider-control-tutorial","url":"https:\/\/mobisoftinfotech.com\/resources\/blog\/iphone\/iphone-slider-control-uislider-control-tutorial","name":"iPhone Slider Control: UISlider Control Tutorial - Mobisoft Infotech","isPartOf":{"@id":"https:\/\/mobisoftinfotech.com\/resources\/#website"},"datePublished":"2010-02-15T10:03:39+00:00","dateModified":"2024-11-18T10:28:44+00:00","author":{"@id":"https:\/\/mobisoftinfotech.com\/resources\/#\/schema\/person\/6975ec0e158682ee8e5f4fbd7221b932"},"description":"Slider is a horizontal bar with a slider button which can slide along the bar\u2019s length.Learn more on iPhone Slider Control: UISlider Control.","breadcrumb":{"@id":"https:\/\/mobisoftinfotech.com\/resources\/blog\/iphone\/iphone-slider-control-uislider-control-tutorial#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/mobisoftinfotech.com\/resources\/blog\/iphone\/iphone-slider-control-uislider-control-tutorial"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/mobisoftinfotech.com\/resources\/blog\/iphone\/iphone-slider-control-uislider-control-tutorial#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/mobisoftinfotech.com\/resources\/"},{"@type":"ListItem","position":2,"name":"iPhone Slider Control: UISlider Control Tutorial"}]},{"@type":"WebSite","@id":"https:\/\/mobisoftinfotech.com\/resources\/#website","url":"https:\/\/mobisoftinfotech.com\/resources\/","name":"Mobisoft Infotech","description":"Discover Mobility","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/mobisoftinfotech.com\/resources\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Person","@id":"https:\/\/mobisoftinfotech.com\/resources\/#\/schema\/person\/6975ec0e158682ee8e5f4fbd7221b932","name":"Ruchi Raval","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/secure.gravatar.com\/avatar\/c48187f401d31f2a08585cb66b4503c90f0586889e7212ae0680cd4edcb9910e?s=96&r=g","url":"https:\/\/secure.gravatar.com\/avatar\/c48187f401d31f2a08585cb66b4503c90f0586889e7212ae0680cd4edcb9910e?s=96&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/c48187f401d31f2a08585cb66b4503c90f0586889e7212ae0680cd4edcb9910e?s=96&r=g","caption":"Ruchi Raval"},"sameAs":["http:\/\/www.mobisoftinfotech.com"]}]}},"_links":{"self":[{"href":"https:\/\/mobisoftinfotech.com\/resources\/wp-json\/wp\/v2\/posts\/4098","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/mobisoftinfotech.com\/resources\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/mobisoftinfotech.com\/resources\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/mobisoftinfotech.com\/resources\/wp-json\/wp\/v2\/users\/13"}],"replies":[{"embeddable":true,"href":"https:\/\/mobisoftinfotech.com\/resources\/wp-json\/wp\/v2\/comments?post=4098"}],"version-history":[{"count":24,"href":"https:\/\/mobisoftinfotech.com\/resources\/wp-json\/wp\/v2\/posts\/4098\/revisions"}],"predecessor-version":[{"id":32179,"href":"https:\/\/mobisoftinfotech.com\/resources\/wp-json\/wp\/v2\/posts\/4098\/revisions\/32179"}],"wp:attachment":[{"href":"https:\/\/mobisoftinfotech.com\/resources\/wp-json\/wp\/v2\/media?parent=4098"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/mobisoftinfotech.com\/resources\/wp-json\/wp\/v2\/categories?post=4098"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/mobisoftinfotech.com\/resources\/wp-json\/wp\/v2\/tags?post=4098"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}