Bagaimana cara menambahkan batas garis putus-putus di sekitar UIView
.
Sesuatu seperti ini
ios
objective-c
iphone
uiview
Sohaib
sumber
sumber
Jawaban:
Anda dapat mengatur perbatasan dengan pola ini menggunakan jalur Layer dan Bezier seperti contoh di bawah ini.
Objektif-C
Cepat 3.1
Anda juga dapat mengatur berbagai jenis desain menggunakan gambar pola seperti contoh di bawah ini.
Di sini Anda harus menambahkan
<QuartzCore/QuartzCore>
kerangka kerja dalam proyek dan mengimpornya denganYourViewController.m
file baris di bawah ini .sumber
Metode lain jika Anda suka sublayers. Di init tampilan khusus Anda, masukkan ini (_border adalah ivar):
Dan dalam tampilan layout Anda, taruh ini:
sumber
_border.path = [UIBezierPath bezierPathWithRoundedRect:self.bounds cornerRadius:5.f].CGPath;
_border.lineWidth = 3
border = CAShapeLayer() border.strokeColor = yourColor border.fillColor = nil border.lineDashPattern = [4, 2] self.layer.addSublayer(border)
Bagi Anda yang bekerja di Swift, ekstensi kelas ini di UIView membuatnya mudah. Ini didasarkan pada jawaban sunshineDev.
Untuk menggunakannya:
sumber
addDashedBorder()
selamadidMoveToSuperview()
berpikir autolayout akan selesai pada saat itu dan ukuran frame akan benar tetapi tidak. Lebar batas putus-putus melampaui lebar tampilan. Garis putus-putus terlihat sangat bagus! Ituself.frame.size
tidak benar.Swift 3 :
Gunakan di storyboard (sebagai kelas khusus) atau langsung dalam kode:
Hasil:
sumber
Berdasarkan apa yang disarankan Prasad G, saya membuat metode di dalam kelas UIImage Extras dengan berikut:
Penting untuk menunjukkan bahwa jika Anda menentukan posisi bentuk Anda sebagai (0,0), sudut bawah perbatasan akan ditempatkan di tengah gambar, itu sebabnya saya mengaturnya ke: (frameSize.width / 2, frameSize .tinggi / 2)
Saya kemudian menggunakan metode saya untuk mendapatkan garis putus-putus menggunakan UIImage dari UIImageView saya dan menambahkan CAShapeLayer sebagai sublayer dari lapisan UIImageView:
sumber
Gunakan metode CGContextSetLineDash ().
Saya pikir ini akan sangat membantu Anda.
sumber
Berikut ini adalah subkelas UIView yang dapat bekerja untuk proyek apa pun, dan juga berfungsi untuk tampilan bulat :
Dengan cara ini Anda dapat mengedit dari Storyboard seperti ini:
Sepasang hasil:
sumber
Untuk ini, Anda perlu menambahkan CAShapeLayer untuk objek tertentu
sumber
Cepat 4.2
Didasarkan pada jawaban rmooney sebagai
UIView
ekstensi dengan parameter yang dapat dikonfigurasi yang memiliki nilai default yang ditetapkan.sumber
shapeLayer.lineJoin = CAShapeLayerLineJoin.round
seharusnyayourViewBorder.lineJoin = kCALineJoinRound
Versi cepat jawaban QuartzCore.
The
CAShapeLayer
pendekatan bekerja, tapi pendekatan QuartzCore adalah lebih baik dalam menangani sebuah Table View ulang, jikaUIView
berada di dalam sel.Untuk gambar, Anda dapat menggunakan sesuatu seperti ini (sangat kecil):
Saya cenderung lebih suka vektor daripada PNG ketika saya bisa lolos begitu saja:
Images.xcassets
, buatNew Image Set
disebut dottedPatternScale Factors
keSingle Vector
sumber
Untuk Xamarin.iOS garis putus-putus / putus-putus.
sumber
Dalam Swift 3
sumber
Ini jika Anda menginginkannya di Swift 2
sumber
coba kode di bawah ini
untuk yang seperti di bawah
sumber
Untuk Swift 5
Bagaimana cara menambahkan
Cara menghapus perbatasan lagi
sumber
Saya akhirnya membuat IB Designable menggunakan beberapa implementasi @Chris:
CurvedDashedBorderUIVIew.h:
CurvedDashedBorderUIVIew.m:
maka cukup atur di xib / storyboard:
sumber
Solusi cepat dengan kelas kustom berfungsi dengan autolayout
dikustomisasi dari @Iain Smith
sumber
Anda cukup membuat kelas IBDesignable seperti ini:
Kemudian, cukup subkelas tampilan Anda dengan BorderedView dari Xcode. Dengan cara ini Anda dapat mengatur warna tepi dan lebar tepi dengan sangat mudah dari pembuat antarmuka!
sumber
} dan panggil fungsi ini di viewdidLoad () dengan penundaan:
sumber
• Cepat 5
• Bekerja dengan pembayaran otomatis
• Bekerja dengan jari-jari sudut
sumber
Di swift 4 saya membuat ekstensi UIView dengan fungsi berikut:
sumber
Jika Anda ingin ini berfungsi dengan cornerRadius maka coba ini
sumber
Swift 5+
Cara Penggunaan:
sumber