Making Image Slider with UIScrollView in Swift - ios

I am making an app that the user can upload 1 to 3 photos.
I want the user to be able to see them it as a slider in with Page Control,
I started to code it but for some reason the images do not added to the scrollView (I see nothing when running the app).
This is my code so far:
class dogProfileViewController: UIViewController {
var imagesArray = [UIImageView()]
#IBOutlet var scrollView: UIScrollView!
override func viewDidLoad() {
super.viewDidLoad()
let image1: UIImageView = UIImageView(image: UIImage(named: "image1.png"))
let image2: UIImageView = UIImageView(image: UIImage(named: "image2.png"))
imagesArray.append(image1)
imagesArray.append(image2)
var countIndex = CGFloat(0)
for image in imagesArray {
image.frame = CGRectMake(countIndex*view.frame.width, 0, view.frame.width, 100)
scrollView.addSubview(image)
countIndex = countIndex + 1
}
// Do any additional setup after loading the view.
}
}

Add the following line after the for loop ends
scrollView.contentSize = CGSizeMake(countIndex*view.frame.width,0)
I think this will work.

#IBOutlet var mainScrollView: UIScrollView!
var imageArray = [UIImage]()
override func viewDidLoad() {
super.viewDidLoad()
mainScrollView.frame = CGRect(x: 0, y: 0, width: view.frame.width, height: 175)
imageArray = [#imageLiteral(resourceName: "cake"),#imageLiteral(resourceName: "food")]
for i in 0..<imageArray.count{
let imageView = UIImageView()
imageView.image = imageArray[i]
imageView.contentMode = .scaleToFill
let xPosition = self.view.frame.width * CGFloat(i)
imageView.frame = CGRect(x: xPosition, y: 0, width: self.mainScrollView.frame.width, height: self.mainScrollView.frame.height)
mainScrollView.contentSize.width = mainScrollView.frame.width * CGFloat(i + 1)
mainScrollView.addSubview(imageView)
}
}

Well, according to what you provided, you haven't added the scrollView to the view. So, first step, make sure the scrollView is added to the view. self.view.addSubiew(scrollView). Change the scrollView background to make sure it is there.
Also, I don't see that you have initialized the scrollView frame. The scrollView has no frame, so it won't show anywhere. Make sure that you initialize the scrollView.

Related

CGRect function is not working while placing image in textfield

I am trying to set image inside the textfield , and for that i am creating an image view in code but when i am trying to adjust its width and height via CGRect(x:int, y:int, width:int, height:int) , its not being applied and the image size is still original. I ve seen so many tutorials for putting image in text field and all of them are using CGRect and its working for them, as size of image gets what they apply in CGRect, but not for me. Below is the code i m trying to use. Image is also attached. Textfield style is rounded (Default) and icon size is 50px.
UIViewController
import UIKit
class ViewController: UIViewController {
#IBOutlet weak var email: UITextField!
override func viewDidLoad() {
super.viewDidLoad()
update()
// Do any additional setup after loading the view.
}
func update() {
email.leftViewMode = .always
let imageview = UIImageView()
let image = UIImage(named: "icon")
imageview.image = image
imageview.frame = CGRect(x: 15, y: 0, width: 50 , height: 50)
email.leftView = imageview
}
}
Also, i ve tried to change 'Render as' to 'template' in image assets but its still not working.
Hey I’ve tried to do it programmatically and it works for me. Quickly drafted it on iPad playgrounds. Try this:
class Test: UIViewController {
let lable = UITextField()
let image = UIImage()
override func viewDidLoad() {
super.viewDidLoad()
self.view.backgroundColor = .white
lable.frame = CGRect(x: 200, y: 200, width: 300 , height: 50)
lable.backgroundColor = .black
update()
self.view.addSubview(lable)
}
func update() {
lable.leftViewMode = .always
let imageview = UIImageView()
let image = UIImage(systemName: "icloud")
imageview.image = image
imageview.frame = CGRect(x: 15, y: 0, width: 50 , height: 50)
lable.leftView = imageview
self.view.addSubview(imageview)
}
}

Size of image inside textfield is not resizing

I have a custom text field and i want to place image on its left side, but when ever i am running the app, the size of image is not adjusting , i.e its full scale and not taking the width and height being provided. The code and pictures are attached
ViewController class:(In which text field is present)
import UIKit
class Signup2ViewController: UIViewController {
#IBOutlet weak var Email: UITextField!
override func viewDidLoad() {
super.viewDidLoad()
Email.leftViewMode = .always
let imageview = UIImageView()
imageview.frame = CGRect(x: 0, y: 0, width: 5.0, height: 5.0)
view.addSubview(imageview)
let icon = UIImage(named: "c.png")
imageview.image = icon
Email.leftView = imageview
// Do any additional setup after loading the view.
}
}
To set the frame for your imageView you need to subclass UITextField and override leftViewRect(forBounds:). The code below will result in a 20x20 view offset 10 points from the left and centered vertically.
class AwesomeTextField: UITextField {
override func leftViewRect(forBounds bounds: CGRect) -> CGRect {
let leftViewHeight: CGFloat = 20
let y = bounds.size.height / 2 - leftViewHeight / 2
return .init(x: 10, y: y, width: leftViewHeight, height: leftViewHeight)
}
}
To add an imageView to the textField you would do this:
class ViewController: UIViewController {
#IBOutlet weak var textField: AwesomeTextField!
override func viewDidLoad() {
super.viewDidLoad()
let imageView = UIImageView()
imageView.image = UIImage(named: "c")
textField.leftView = imageView
textField.leftViewMode = .always
}
}
Make sure you set the appropriate class name for the textField in the identity inspector of your storyboard.

How can I update a UIView width with a UISlider?

I'm trying to change the width of a UIView with a slider. My problem is that instead of updating the views width my code is adding new views. I don't know how to update the view with swift playgrounds.
import UIKit
import PlaygroundSupport
class MyViewController : UIViewController {
var feelings01Slider: UISlider!
var feelingsWidth01 = 100
var dayFeelings01: UIView!
var dayFeelings02: UIView!
var dayFeelings03: UIView!
override func loadView() {
let view = UIView()
view.backgroundColor = .white
self.view = view
feelings01Slider = UISlider()
feelings01Slider.frame = CGRect(x: 62, y: 375, width: 250, height: 20)
feelings01Slider.minimumValue = 1
feelings01Slider.maximumValue = 248
feelings01Slider.value = 100
feelings01Slider.isContinuous = true
feelings01Slider.addTarget(self, action: #selector(sliderValueDidChange(sender:)), for: .valueChanged)
setUpFeelings()
view.addSubview(feelings01Slider)
}
func setUpFeelings() {
feelingsWidth01 = Int(feelings01Slider.value)
var feelingsX02 = feelingsWidth01 + 62
var feelingsWidth02 = 80
var feelingsX03 = feelingsX02 + feelingsWidth02
var feelingsWidth03 = 70
dayFeelings01 = UIView(frame: CGRect(x: 62, y: 100, width: feelingsWidth01, height: 250))
dayFeelings01.backgroundColor = .yellow
dayFeelings02 = UIView(frame: CGRect(x: feelingsX02, y: 100, width: feelingsWidth02, height: 250))
dayFeelings02.backgroundColor = .blue
dayFeelings03 = UIView(frame: CGRect(x: feelingsX03, y: 100, width: feelingsWidth03, height: 250))
dayFeelings03.backgroundColor = .red
view.addSubview(dayFeelings01)
view.addSubview(dayFeelings02)
view.addSubview(dayFeelings03)
}
#objc func sliderValueDidChange(sender:UISlider) {
feelingsWidth01 = Int(sender.value)
dayFeelings03.removeFromSuperview()
dayFeelings02.removeFromSuperview()
dayFeelings01.removeFromSuperview()
setUpFeelings()
}
}
// Present the view controller in the Live View window
PlaygroundPage.current.liveView = MyViewController()
I'm new to programming so excuse me if my code seems messy.
You don't need to replace the views with new, differently-sized views . You can just change their frames. Replace your slider selector action with this:
#objc func sliderValueDidChange(sender:UISlider) {
dayFeelings01.frame.size.width = CGFloat(sender.value)
}
Note: because the yellow view was added first, it is expanding underneath the other views. That's why you can't see it get wider. Try changing the order so it's added last and you'll see it. If you want the other views to adjust to the available space, you can update their frames too, a UIStackView might make that easy.
Good luck!

Adding gestures to uiimageview in uiscrollview (pan, doubletap, pinch)

Currently i am trying to create some kind of an imageviewer, where you can click on an image which is then displayed in full size. Now i want to add gestures to it to zoom. I want to understand and see how to add the pinch gesture to zoom in and out, to be able to pan around the image and to zoom in quickly with the double tap gesture. I did not found much good tutorials.
I know that you zoom into the view, not into the image. That is why you use a ScrollView containing an ImageView. Now what is missing to enable zooming, pinching and moving the image around?
Thank you in advance for any helpful post.
In the following is "my" current code base for this feature. What needs to be added?
class DetailViewController: UIViewController, UIScrollViewDelegate {
var scrollView: UIScrollView!
var imageView: UIImageView!
override func viewDidLoad()
{
super.viewDidLoad()
self.navigationController?.isNavigationBarHidden = false
scrollView=UIScrollView()
scrollView.frame = CGRect(x: 0, y: 0, width: self.view.frame.width, height: (self.view.frame.height - (self.navigationController?.navigationBar.frame.size.height)! + 44))
scrollView.minimumZoomScale=1
scrollView.maximumZoomScale=3
scrollView.bounces=false
scrollView.delegate=self
self.view.addSubview(scrollView)
imageView=UIImageView()
imageView.image = UIImage(named: "inlinelogo.jpg")
imageView.frame = CGRect(x: 0, y: 0, width: scrollView.frame.width, height: scrollView.frame.height - (44 + UIApplication.shared.statusBarFrame.size.height))
imageView.backgroundColor = .black
imageView.contentMode = .scaleAspectFit
scrollView.addSubview(imageView)
}
func viewForZoomingInScrollView(scrollView: UIScrollView) -> UIView?
{
return imageView
}
}
you missed the userInteractionEnabled property of UIImageView add
imageView.isuserInteractionEnabled = true

Pull to Refresh plug-in : PullToBounce Wrapper UIScrollView

I am trying to use this plugin as refresh action : https://github.com/entotsu/PullToBounce
One, issue is I can't understand his explanation.
Explanation given on the github
tableView.frame = yourFrame --> tableView is equal to scrollView.frame in my situation
yourFrame --> I have no idea what it is. The main frame ? Another Frame I have to create ?
bodyView.addSubview(tableViewWrapper) --> bodyView ? Main Frame here ? or Another frame ?
Here is my code for the scrollView for now. Any help on how to implement this plugin using a scrollView made via the storyboard.
class ProfileViewController: UIViewController {
#IBOutlet weak var scrollView: UIScrollView!
func makeMock() {
let headerView = UIView()
headerView.frame = CGRect(x: 0, y: 0, width: self.view.frame.width, height: 64)
headerView.backgroundColor = UIColor.lightBlue
self.view.addSubview(headerView)
let headerLine = UIView()
headerLine.frame = CGRect(x: 0, y: 0, width: 120, height: 8)
headerLine.layer.cornerRadius = headerLine.frame.height/2
headerLine.backgroundColor = UIColor.whiteColor().colorWithAlphaComponent(0.8)
headerLine.center = CGPoint(x: headerView.frame.center.x, y: 20 + 44/2)
headerView.addSubview(headerLine)
}
override func viewDidLoad() {
super.viewDidLoad()
self.view.backgroundColor = UIColor.blue
let bodyView = UIView()
bodyView.frame = scrollView.frame
bodyView.frame.y += 20 + 44
self.view.addSubview(bodyView)
let tableViewWrapper = PullToBounceWrapper(scrollView: scrollView)
bodyView.addSubview(tableViewWrapper)
tableViewWrapper.didPullToRefresh = {
NSTimer.schedule(delay: 2) { timer in
tableViewWrapper.stopLoadingAnimation()
}
}
makeMock()
}
override func preferredStatusBarStyle() -> UIStatusBarStyle {
return .LightContent
}
}
One thing, I notice is that there is a View on top of my scrollView that disable me to view it and scroll it. Help here needed please.
Regards,
Hary
Take a look at the Example of this library.
yourFrame is nothing but your tableview class. For example if your tableView Class is named SampleTableView, then it goes like
let tableView = SampleTableView(frame: self.view.frame, style: UITableViewStyle.Plain).
You have to use another class to set up your tableView.

Resources