Thanks to the airplay audio systemName emoji I made a nice icon
Button(action: {
showAirplay()
}, label: {
Image(systemName: "airplayaudio")
.imageScale(.large)
})
func showAirplay() {
???
}
But I have no idea how to display the famous menu :
Wrapping the AirPlay UIView for SwiftUI seems to be the best and simplest solution.
struct AirPlayView: UIViewRepresentable {
func makeUIView(context: Context) -> UIView {
let routePickerView = AVRoutePickerView()
routePickerView.backgroundColor = UIColor.clear
routePickerView.activeTintColor = UIColor.red
routePickerView.tintColor = UIColor.white
return routePickerView
}
func updateUIView(_ uiView: UIView, context: Context) {
}
}
Usage :
VStack {
AirPlayView()
}
Finally I managed to solve it myself :D Like said in the comment I have to "embed it inside" UIKit and use it in SwiftUI
Firstly :
struct AirPlayButton: UIViewControllerRepresentable {
func makeUIViewController(context: UIViewControllerRepresentableContext<AirPlayButton>) -> UIViewController {
return AirPLayViewController()
}
func updateUIViewController(_ uiViewController: UIViewController, context: UIViewControllerRepresentableContext<AirPlayButton>) {
}
}
Then classic ViewController where we know from ages how to show this famous AirPlay menu popup :
class AirPLayViewController: UIViewController {
override func viewDidLoad() {
super.viewDidLoad()
let isDarkMode = self.traitCollection.userInterfaceStyle == .dark
let button = UIButton()
let boldConfig = UIImage.SymbolConfiguration(scale: .large)
let boldSearch = UIImage(systemName: "airplayaudio", withConfiguration: boldConfig)
button.setImage(boldSearch, for: .normal)
button.frame = CGRect(x: 0, y: 0, width: 40, height: 40)
button.backgroundColor = .red
button.tintColor = isDarkMode ? .white : .black
button.addTarget(self, action: #selector(self.showAirPlayMenu(_:)), for: .touchUpInside)
self.view.addSubview(button)
}
@objc func showAirPlayMenu(_ sender: UIButton){ // copied from https://stackoverflow.com/a/44909445/7974174
let rect = CGRect(x: 0, y: 0, width: 0, height: 0)
let airplayVolume = MPVolumeView(frame: rect)
airplayVolume.showsVolumeSlider = false
self.view.addSubview(airplayVolume)
for view: UIView in airplayVolume.subviews {
if let button = view as? UIButton {
button.sendActions(for: .touchUpInside)
break
}
}
airplayVolume.removeFromSuperview()
}
}
Finally in SwiftUI simply call :
struct ContentView: View {
var body: some View {
VStack {
Text("Hello World")
AirPlayButton().frame(width: 40, height: 40) // (important to be consistent with this frame, like that it is nicely centered... see button.frame in AirPlayViewController)
}
}
}
func showAirplay() {
let rect = CGRect(x: 0, y: 0, width: 0, height: 0)
let airplayVolume = MPVolumeView(frame: rect)
airplayVolume.showsVolumeSlider = false
UIApplication.shared.windows.first?.addSubview(airplayVolume)
for view: UIView in airplayVolume.subviews {
if let button = view as? UIButton {
button.sendActions(for: .touchUpInside)
break
}
}
airplayVolume.removeFromSuperview()
}
I have modified Max's answer to my needs and thought it could be useful to share. It adapts to the superview with autolayout and has a method to call its action.
import SwiftUI
import AVKit
struct AirPlayView: UIViewRepresentable {
private let routePickerView = AVRoutePickerView()
func makeUIView(context: UIViewRepresentableContext<AirPlayView>) -> UIView {
UIView()
}
func updateUIView(_ uiView: UIView, context: UIViewRepresentableContext<AirPlayView>) {
routePickerView.tintColor = .white
routePickerView.activeTintColor = .systemPink
routePickerView.backgroundColor = .clear
routePickerView.translatesAutoresizingMaskIntoConstraints = false
uiView.addSubview(routePickerView)
NSLayoutConstraint.activate([
routePickerView.topAnchor.constraint(equalTo: uiView.topAnchor),
routePickerView.leadingAnchor.constraint(equalTo: uiView.leadingAnchor),
routePickerView.bottomAnchor.constraint(equalTo: uiView.bottomAnchor),
routePickerView.trailingAnchor.constraint(equalTo: uiView.trailingAnchor)
])
}
func showAirPlayMenu() {
for view: UIView in routePickerView.subviews {
if let button = view as? UIButton {
button.sendActions(for: .touchUpInside)
break
}
}
}
}
You can still use it directly as a view, as in Max's answer, but also you can embed it in another view like a button and trigger the menu by hand, like I needed to:
@State private var airPlayView = AirPlayView()
var body: some View {
VStack {
// other views
Button(action: {
// other actions
airPlayView.showAirPlayMenu()
}) {
HStack {
Text("Show AirPlay menu")
Spacer()
airPlayView
.frame(width: 32, height: 32)
}
}
.buttonStyle(PlainButtonStyle())
}
}
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.