firebase创建数据库
我目前正在开发一个名为i-Travel Journal的旅行应用程序 ，而我想添加的功能之一是允许用户上载和删除图库中的照片的功能。 我正在互联网上搜索一篇博客文章，该文章不仅在后端使用了Firebase，而且还使用了很棒的INSPhotoGallery Pods Framework完成了工作，但令我沮丧的是，我找不到能显示所有复杂细节的文章。 因此，为了帮助我的编码员，我决定发布一篇文章，以帮助某人启动并运行他们的照相馆。
为了简短起见，如果您尚未将Firebase文档集成到Firebase文档中，我将提供该链接以帮助您入门。
1.首先初始化一个新的视图控制器并初始化UICollectionView的委托
import UIKit import Firebase import FirebaseDatabase import FirebaseFirestore class ViewController: UIViewController, UICollectionViewDataSource, UICollectionViewDelegate, UIImagePickerControllerDelegate{ var ref: DatabaseReference! @IBOutlet weak var collectionView: UICollectionView? var URLs = []() lazy var gallery: [INSPhotoViewable] = []
class ViewController: UIViewController, UICollectionViewDataSource, UICollectionViewDelegate, UIImagePickerControllerDelegate{ var ref: DatabaseReference! @IBOutlet weak var collectionView: UICollectionView? var URLs = []() lazy var gallery: [INSPhotoViewable] = []
class ViewController: UIViewController, UICollectionViewDataSource, UICollectionViewDelegate, UIImagePickerControllerDelegate{ var ref: DatabaseReference! @IBOutlet weak var collectionView: UICollectionView? var URLs = []() lazy var gallery: [INSPhotoViewable] = [] override func viewDidLoad() { collectionView!.delegate = self collectionView!.dataSource = self } }
当您首次初始化ViewController类时，您将获得一个空白的UIViewController类，我们想使用UICollectionView来显示画廊，因此我们在视图控制器中使用适当的委托方法UICollectionViewDelegate以及UICollectionViewDataSource来覆盖某些功能。 我们还将使用UIImagePicker从用户库中选择图像，因此我们使用UIImagePickerControllerDelegate。
我还初始化了一些变量，稍后我们将使用它们。
下面的方法是我们将用来实现图库的方法，以及我将要创建的一些辅助方法：
func collectionView(_ collectionView: UICollectionView, numberOfItemsInSection section: Int) -> Int { return gallery.count + 1 //Add the additional 1 to use it as the placeholder for the gallery selector image } func numberOfSections(in collectionView: UICollectionView) -> Int { return 1 //We are only using one section of collections views for this example //If you want to add filters to your gallery you could increase the section count } func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell { } func collectionView(_ collectionView: UICollectionView, didSelectItemAt indexPath: IndexPath) { } func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAt indexPath: IndexPath) -> CGSize { return CGSize.init(width: 150, height: 150) //This is the default size, you can change it to fit your needs }
2.跳到Main.StoryBoard并使用我们的组件初始化我们的UIViewController
现在我们已经有了方法，现在我们将跳到Main.Storyboard并设置我们的组件。 首先，我们从空白情节提要上的组件列表中拖动ViewController。 在侧面菜单上，我们使用“自定义类”选项卡并选择我们刚刚创建的自定义视图控制器的名称，您可以随意命名它，但要确保它在整个应用程序中保持一致。
接下来，我们将一个UICollectionView拖到该ViewController上，这将自动在其下面创建一个UICollectionViewCell组件，该组件将用于显示CollectionView的每一行所需的内容。
对于UICollectionView中的一个单元格，我们希望UIImageView显示一个图像以及一个删除按钮以删除该图像。 因此，在出现的单元格中，我拖动了一个UIImageView和一个按钮组件。 我利用自动布局约束来放置按钮，您可以将按钮放置在图像的任何角落，可以自行决定。 对于删除按钮的图标，我从这里获得了图标，并将其拖动到Assets.xcassets文件中。 我还使用了占位符缩略图作为用于画廊图像的单元格，您可以通过点击UIImageView并在右侧的侧面菜单中选择它来使用您选择的任何图像，只需确保它位于Assets文件夹中即可。
3.创建一个自定义UICollectionViewCell
import UIKit class CustomUICollectionViewCell: UICollectionViewCell { @IBOutlet weak var image: UIImageView!
@IBOutlet weak var delete: UIButton!
}
现在我们已经有了一个希望UICollectionViewCell看起来像的结构，我们需要创建一个自定义类来模仿它的结构。 因此，我们要做的就是创建自己的。
现在，我们已经创建了该类，我们跳回到Main.Storyboard类，并开始将刚刚创建的自定义类连接到我们刚刚拖放的UICollectionViewCell组件，方法是转到右侧的侧面板并选择它。
接下来，我们开始连接刚刚在自定义类中创建的UIImage和Buttons。 我们还想给UICollectionViewCell一个唯一的名称，以便我们以后可以在代码中使用它，因此可以在下面的菜单中对其进行设置。
4.我们返回到助手方法和委托方法
现在，我们已经完成了在Storyboard上以及通过自定义类在代码中所需完成的所有连接工作，现在我们可以开始操作我们之前创建的方法了。
首先， 请看一下以下文档并安装INSPhotoGallery的Cocoa Pod。 这是我们在单击时实际用来显示画廊的方式。
辅助方法（整堆）
这三种辅助方法是应用中的肉🍖和土豆🥔。 Firebase是dope应用程序，它使我们能够定义记录的结构，我们希望将这些记录保存起来，以便轻松，自由地操作和检索它。 为了避免每次添加新图像时都覆盖所有图像，我们必须尝试以一种可以轻松地检索它的方式构造它，如下所示：
-Gallery ID -> URL Gallery- 5C3E4F78-FC18-46C7-8545-26D229861465 : " https://firebasestorage.googleapis.com/v0/b/mytravelapp-e365b.appspot.com/o/gallery%2F6CE2EAA7-14B8-4820-9737-466FD95AA11E.jpg?alt=media&token=b621d365-aaee-4666-9817-d8dee0022afc -Gallery ID -> URL Gallery- 5C3E4F78-FC18-46C7-8545-26D229861465 : " https://firebasestorage.googleapis.com/v0/b/mytravelapp-e365b.appspot.com/o/gallery%2F6CE2EAA7-14B8-4820-9737-466FD95AA11E.jpg?alt=media&token=b621d365-aaee-4666-9817-d8dee0022afc
每个图像都在图库子项下，然后每个子项都有一个唯一的ID，该ID指向Firebase存储中的URL位置
提取图库
fetch gallery方法检查Firebase中是否存在子属性画廊的任何元素。 它循环遍历并尝试填充我们之前创建的Gallery Array，但是在完成操作之前，我们希望在调用imageToURL方法之前防止Gallery显示重复的记录.
因此，它将扫描包含库，以使用contains方法查看可访问性引用在库中是否有任何重复项。 尽管可访问性参考通常用作图像的描述性文本，但在本例中，我们使用它来唯一地跟踪Firebase中使用的ID。
imageToURL
从INSPhotoGallery文档中可以看到，他们使用INSPhoto对象来初始化其画廊。 要显示UICollectionCell的每个元素缩略图，我们必须点击Firebase提供的URL，以便下载图像并将其显示在应用程序中。 因此，每次将元素添加到视图时，我们都会刷新CollectionView以使用最新图像更新UI，这就是使用DispatchQueue.main.async以便在主线程上激活它的原因。
uploadImageToFirebase
此方法实际上是处理上传到Firebase的数据的方法。 目的是当用户从UIImagePicker中选择图像时，他们可以立即将数据上传到Firebase。 实时数据库中的数据在很大程度上取决于是否已将图像成功上传到Firebase Storage。 成功上传图像后，完成处理程序将返回带有实际图像链接的下载URL，该链接将附加到现有的图库数组中。 如果上传过程中有任何问题，则会使用以下代码触发警报，通知用户：
func displayAlert( title: String, message: String){ let alert = UIAlertController.init(title: title , message: message , preferredStyle: .alert) let dismiss = UIAlertAction.init(title: "dismiss", style: .default, handler: nil) alert.addAction(dismiss) present(alert, animated: true, completion: nil) }
CellForRowAt
在这种方法中，我们为看到的每个单元格设置视图。 IndexPath可以跟踪用于遍历我们拥有的单元格数组的索引号。 还记得我们之前创建的自定义单元名称吗？ 我们使用它来标识我们创建的单元格自定义组件的结构。
因此，对于第一个单元格行，我希望显示图库图像，允许用户与该单元格进行交互，并隐藏删除按钮。
对于所有其他单元格，我希望显示删除按钮。 我添加了一个称为handle click的方法，稍后将详细讨论该方法，该方法实际上可以处理单击记录的删除。
handleClick
此方法适用于每个附加了删除按钮的按钮。 为了防止用户轻松删除元素，我使用UIAlertController作为用户的安全防护。 如果“是”被选择使用sender.tag使用IndexPath.row在CellForItemAt方法应用，该要素是使用通过无障碍标识传递的唯一ID标识，它找到的纪录火力地堡，并将其设置为无。 从Firebase中删除元素时，将调用FetchGallery，该更新将更新UI以删除该元素。 Fetch Gallery使用观察处理程序，该观察程序一旦设置，就会侦听对记录所做的任何更新，例如删除，添加或更新现有记录。
DidSelectItemAt
didSelectItemAt处理当用户单击图像时发生的情况。 如果索引为0，则将显示图像选择器。 我将在下面详细讨论。 INSPhotoGallery的魔力尚未真正揭示出来，但这就是现在的光芒。 因为我为Gallery Image创建了一个占位符，所以indexPath的值偏移为1，因此为了准确显示数组的实际大小，我将数组的总数减去1。
这实际上是INSPhotoGallery文档中的副本和粘贴。 简而言之，他们的代码正在执行的操作是遍历Gallery数组的索引并检查其中是否确实有图像。 如果存在图像，它将使用已设置的特殊View Controller以全尺寸显示图像。
ImagePickerController
这是最后一个完整的圆圈，要上传图片，您需要一张图片！ 为了获得该图像，我们使用UIImagePicker并允许用户有机会从那里选择的画廊中选择图像。
如果用户成功选择了一个图像，我们将同时做两件事，将图像添加到Gallery数组中，然后我们使用存储引用来调用上面定义的uploadImageToFirebase方法。 之后，我们重新加载集合视图，以便可以进行新的更改。
结论
今天，我们使用Firebase Realtime Database，Firebase Storage和流行的图库框架INSPhotoGallery创建了图库。 尽管这看起来很复杂，但您可以了解Firebase如何快速集成到应用程序中，并看到一个简单的用法。
我还邀请您为我的应用程序I-Travel Journal试用Beta。 如果您想提供帮助，请进行测试，并在以下链接中留下反馈。 感谢您阅读我的文章，查看我以前的文章以获取有用的信息。
