iOS可视化动态绘制八种排序过程

前面几篇博客都是关于排序的，在之前陆陆续续发布的博客中，我们先后介绍了冒泡排序、选择排序、插入排序、希尔排序、堆排序、归并排序以及快速排序。俗话说的好，做事儿要善始善终，本篇博客就算是对之前那几篇博客的总结了。而本篇博客的示例Demo也是在之前那些博客Demo的基础上做的，也算是集成了各种排序的方法，然后给出了可视化的解决方案。今天博客的内容还是比较有趣的。,因为本猿是做iOS开发的，所以就使用iOS相关的组件来表示上述各种排序的过程。使用可视化方式来感受一下上述这些排序方法的异同。本篇博客所使用的相关的排序代码都是来自于之前的博客。因为我们在之前实现各种排序Demo时，我们定义了相应的排序接口SortType，所以上述的七种排序对外的调用方式是一致的，所以在此基础上给出相应排序的可视化解决方案并不困难。本篇博客就会给出其相应的扩展过程。,如果你想对上述7中排序进行详细的了解，请移步与之前的博客《冒泡排序、插入排序、希尔排序、选择排序》、《堆排序》、《归并排序》、《快速排序》、《基数排序》。废话少说，开始今天的博客。,一、可视化解决方案综述,1.交互UI综述,在本篇博客的第一部分我们先来整体的看一下我们Demo的功能。下方就是我们今天博客中的Demo的交互示意图。上方的输入框可以输入要排序元素的个数，下方输入的是300。程序会根据你输入的个数来随机生成数据，你输入300，就会随机生成300个数据提供排序使用。下方的SegmentControl可以选择不同的排序方式，本篇博客给出了7中常用的排序方式，选择完排序方式后可以点击右上方的排序按钮进行相应的排序。,下方显示的不同颜色的颜色条就是我们要排序的东西，我们会按照从小到大的方式对这些色条进行排序。左图中是未排序的状态，右图中是已经排序的状态。我们上面随机生成的数据反应到色条上就是色条的高度，我们按照色条的高度进行从小到大的排序。下方会给出每种排序的介绍。,　　,2、部分核心代码实现,为了实现今天的Demo，我们需要对之前我们实现的那一些列的排序的方法进行扩展。因为我们之前在实现各种排序时，我们先定义了SortType接口，依据“开放封闭原则”，我们可以为各种排序的类创建一个“简单工厂”以供我们的视图层使用。关于设计模式更多以及更详细的内容，可以移步之前发布的设计模式系列博客《设计模式Swift版》。,　　,上方就是为各种Sort类提供的“简单工厂”。上面这个简单工厂在视图控制器中点击SegmentControl时会使用，因为我们在选择不同排序类的时候需要使用不同的排序对象。下方就是我们视图控制器对“简单工厂”的调用，当然我们所有排序类都有父类，你也可以使用“工厂方法”来创建相应的对象，在此就不做过多赘述了。,下方代码段就是点击SegmentControl要调用的方法，其中从“简单工厂”中获取到相应排序方式的对象后，然后在设置相应的闭包回调。,　　,二、冒泡排序,接下来我们来逐一看一下每种排序的具体效果。下方就是冒泡排序的效果，因为冒泡排序的时间复杂度是O(n^2)的，所以我们先设置元素个数是80， 如果太大的话会比较慢。因为我们在排序步骤结果输出时，每进行一次交换操作或者比较操作让排序线程休眠0.001秒，便于我们观察整个排序过程。,从下方这个动图上我们不难看出冒泡的整个过程，较小的数据从右往左以此往外冒。下方这个效果还是比较直观的，整个冒泡过程就是从后往前比较，如果后边的数要比前边的小就交换。冒泡过程如下所示：,　　,三、选择排序,选择排序的时间复杂度也是O(n^2)。下方是“选择排序”的可视化过程，选择排序的过程就是从无序序列中找出最小的那个值放到有序序列中最后方。不断执行这个过程，我们的序列就是有序的了。下方就是选择排序的整个过程，元素的个数是80.,　　,四、插入排序,插入排序的复杂度与上述选择排序的时间复杂度一样，都是O(n^2)。下方就是插入排序的运行结果。插入排序是从无序序列中取出第一个值，然后插入到前方有序序列中相应的位置。每次插入后，有序序列就会增加1，无序序列就会减少1。下方就是插入排序的过程，如下所示：,　　,五、希尔排序,