如何为形状添加自定义视图修改器

     2023-02-24     159

关键词:

【中文标题】如何为形状添加自定义视图修改器【英文标题】:How can i add a custom View modifier for Shapes 【发布时间】:2019-11-21 00:15:17 【问题描述】:

我想用某种修饰符调用我的 ImageView 以使其中的图像为圆形或方形。代码应如下所示:

ImageView(withURL: newsItem.imageUrl).test(Circle())

要获得我读到的这种行为,您可以像下面那样扩展视图。它与 String 完美搭配,但我不明白 Shape 有什么不同?

我收到错误消息 Protocol type 'Shape' cannot conform to 'Shape' 因为只有具体类型才能符合协议,但我也不明白:/。有人可以解释一下这个问题以及我能做些什么吗?

struct ImageView: View 
    var clipShape: Shape

    var body: some View 
        ZStack 
            Image("swift")
                .resizable()
                .aspectRatio(contentMode: .fill)
                .clipShape(self.clipShape)
                .shadow(radius: 6)
        
    


extension ImageView 
    func test(_ shape: Shape) -> Self 
        var copy = self
        copy.clipShape = shape
        return copy
    

顺便说一句,此代码被缩短为仅显示特定问题的代码,视图包含的内容不止于此。只是为了让您不会质疑它的用途。

提前致谢!

编辑:

为什么形状不起作用以及该怎么做请看:https://forums.swift.org/t/how-to-make-different-clipshape/27448/2 在我的情况下,如果发现只需对整个 ImageView 进行剪辑整形就可以了。 我还想链接这个Creating custom modifiers for Swift UI views,您可以在其中阅读有关自定义修饰符的信息

【问题讨论】:

【参考方案1】:

我在寻找相同标题但意图不同时发现了这个问题 - 我想创建一个可以专门应用于符合 Shape 的东西的修饰符,以便我可以用它做类似 Shape 的效果 - 笔画等。

虽然我还没有找到答案,但我认为您的答案是 ViewModifier 不能插入/更改视图的内部值 - 相反,您应该考虑使用 ViewBuilder。

我发现真正强调如何以及何时有效地选择使用 ViewBuilder 的文章并不多,但 Majid 的这篇题为 The power of @ViewBuilder in SwiftUI 的文章做得很好。 Apple's docs on ViewBuilder 还(幸运的是)在参考资料中包含了一些示例代码(SwiftUI 为数不多的地方之一),这些代码至少向您展示了如何使用它的一些基本想法。

基本要点是 ViewModifier 总是与 View 上的方法一起工作,其中 ViewBuilder 被用作组合视图的一种方式,这听起来更像你想要的。最后,它们在可以做的事情上有很大的重叠——主要是在实现它的方式上有所不同。

【讨论】:

【参考方案2】:

这是一个 3 步过程:

    创建一个ViewModifier 使用函数扩展 View 以应用修改器并返回修改后的视图 在实际的View 上调用您的修改函数
struct RedBackGroundModifier: ViewModifier 
  func body(content: Content) -> some View 
    content.background(Color.red)
  


extension View 
  func makeTheBackGroundRed() -> some View 
    self.modifier(RedBackGroundModifier())
  


struct ContentView: View 
  var body: some View 
    Text("Hello, World!").makeTheBackGroundRed()
  

【讨论】:

你做的和我做的不一样。我想将修改器应用于整个视图,然后定位其中的图像。您只需将其直接放在 Text 上即可。正如我所说,我的代码适用于字符串,但不适用于 Shape 协议 修饰符以它们附加到的视图为目标。视图协议指定 body 是一些视图,这意味着类型是不透明的,您不能访问它的内部成员。您仍然可以将剪辑定位到封闭视图。 这并没有真正帮助我,但我想出了一些办法。我在问题中进行了编辑。还是谢谢!

如何为 UITableView 添加自定义 EditingAccessoryView?

】如何为UITableView添加自定义EditingAccessoryView?【英文标题】:HowtoaddCustomEditingAccessoryViewforUITableView?【发布时间】:2010-10-2508:01:27【问题描述】:我想在单元格中添加自定义EditingAccessoryView,当用户滑动代替删除按钮时,我想显... 查看详情

如何为 MkAnnotation View 自定义视图,就像表格视图的自定义单元格一样?

】如何为MkAnnotationView自定义视图,就像表格视图的自定义单元格一样?【英文标题】:HowtodocustomaviewforMkAnnotationViewAslikecustomcellfortableview?【发布时间】:2011-09-1210:18:53【问题描述】:我制作了一个应用程序,我必须在其中实现... 查看详情

如何为自定义表格视图单元格中的按钮单击获取不同的视图控制器

】如何为自定义表格视图单元格中的按钮单击获取不同的视图控制器【英文标题】:HowdoIgetdifferentviewcontrollersforabuttonclickincustomtableviewcell【发布时间】:2018-07-0507:22:51【问题描述】:如何为通过自定义tableViewCell提供的按钮中的... 查看详情

如何为列表视图创建自定义光标适配器以用于图像和文本?

】如何为列表视图创建自定义光标适配器以用于图像和文本?【英文标题】:howdoicreateacustomcursoradapterforalistviewforusewithimagesandtext?【发布时间】:2011-07-1502:53:42【问题描述】:您好,我想创建一个自定义光标适配器,这样我就可... 查看详情

如何为自定义 Android 通知添加垂直线到 RemoteView?

】如何为自定义Android通知添加垂直线到RemoteView?【英文标题】:HowtoaddverticallinetoRemoteViewforcustomAndroidNotifications?【发布时间】:2012-05-2308:10:03【问题描述】:我正在努力为自定义Android通知添加一条垂直线。我尝试将这样的视图... 查看详情

如何为新式体验文档库自定义 SharePoint Online 列/字段?

】如何为新式体验文档库自定义SharePointOnline列/字段?【英文标题】:HowtocustomizeSharePointOnlinecolumns/fieldforthemodernexperiencedocumentlibraries?【发布时间】:2018-07-2006:52:32【问题描述】:在SharePoint2013和SharePointOnline经典体验中,您可以... 查看详情

如何为列表视图创建自定义适配器?获取 ResourceNotFoundException

】如何为列表视图创建自定义适配器?获取ResourceNotFoundException【英文标题】:Howtocreateacustomadapterforalistview?GettingRessourceNotFoundException【发布时间】:2015-06-2701:37:39【问题描述】:我正在尝试为我的列表视图制作一个自定义适配器... 查看详情

如何为地理视图(散景)创建自定义颜色图?

】如何为地理视图(散景)创建自定义颜色图?【英文标题】:HowcanIcreateacustomizedcolormapforgeoviews(bokeh)?【发布时间】:2021-04-1704:08:09【问题描述】:我正在尝试在Geoviews中绘制一个xarray数据集,如下所示:https://geoviews.org/gallery/bo... 查看详情

如何为特定视图的导航栏设置自定义背景图像

】如何为特定视图的导航栏设置自定义背景图像【英文标题】:HowtoSetthecustombackgroundimagefornavigationbarofaspecificview【发布时间】:2013-05-1905:21:31【问题描述】:我在应用程序delegate.m中使用此代码:-(BOOL)application:(UIApplication*)applicati... 查看详情

如何为 iOS 应用创建自定义容器视图?

】如何为iOS应用创建自定义容器视图?【英文标题】:HowdoIcreateacustomcontainerviewforaniOSApp?【发布时间】:2012-05-2314:18:14【问题描述】:我开始开发一个iPad应用程序,我希望顶部有一个工具栏,它会在其下方显示不同的视图,如下... 查看详情

如何为 UIPageViewController Delegate 制作自定义类?

】如何为UIPageViewControllerDelegate制作自定义类?【英文标题】:HowtomakeacustomclassforUIPageViewControllerDelegate?【发布时间】:2019-02-0715:07:04【问题描述】:我正在编写一个带有UIPageViewController的iOS应用程序。我的根视图控制器是ViewContro... 查看详情

如何为视图中的所有标签设置自定义字体? [复制]

】如何为视图中的所有标签设置自定义字体?[复制]【英文标题】:howsetcustomfontforwholealllabelsinaview?[duplicate]【发布时间】:2013-03-0802:34:33【问题描述】:我想为我的完整视图设置自定义字体我已经提到了以下内容HowdoIsetacustomfontf... 查看详情

如何为自定义视图选择设置膨胀和颜色变化的动画?

】如何为自定义视图选择设置膨胀和颜色变化的动画?【英文标题】:Howtoanimateaswellandcolorchangeforacustomviewselection?【发布时间】:2014-12-1222:51:18【问题描述】:我有自定义UIView对象的层次结构。叶视图是可选的。他们有一个isSelec... 查看详情

如何为颤振添加自定义颜色?

】如何为颤振添加自定义颜色?【英文标题】:howtoaddcustomcolortoflutter?【发布时间】:2018-11-0601:17:37【问题描述】:我想更改AppBar的颜色并为其使用自定义颜色,我尝试了很多选项,但似乎都不起作用。我有什么遗漏吗?import\'pa... 查看详情

如何为android中的所有视图使用相同的自定义字体?

】如何为android中的所有视图使用相同的自定义字体?【英文标题】:howtouseasamecustomfontfaceforalltheviewinandroid?【发布时间】:2013-10-0812:49:52【问题描述】:我想使用android中具有相同字体类型的所有组件,为此我正在为每个组件创... 查看详情

如何为 UIView 的自定义子类设置约束?

】如何为UIView的自定义子类设置约束?【英文标题】:HowtosetconstraintsforcustomsubclassofUIView?【发布时间】:2018-02-1715:33:30【问题描述】:我构建了一个自定义视图作为UIView的子类。现在,我想在我的ViewController中设置这个视图的约... 查看详情

如何为 UITableView 中的单元格添加复选标记(使用自定义 UITableViewCell 子类和 dequeueReusableCell)

】如何为UITableView中的单元格添加复选标记(使用自定义UITableViewCell子类和dequeueReusableCell)【英文标题】:HowtoaddacheckmarktocellsinUITableView(usingacustomUITableViewCellsubclassanddequeueReusableCell)【发布时间】:2020-12-3115:27:09【问题描述】:... 查看详情

如何为自定义 FontFamily 添加权重?

】如何为自定义FontFamily添加权重?【英文标题】:HowtoaddweighttocustomFontFamily?【发布时间】:2017-04-0701:12:46【问题描述】:我有多个来自同一家族的.ttf文件,例如:MyFont.ttfMyFont_Bold.ttfMyFont_Light.ttfMyFont_Medium.ttf如果我想使用每个权... 查看详情