为什么缩放以填充比 UIImageVIew 尺寸更大的图像?(使用迅捷) [英] Why scale to fill give bigger image than UIImageVIew size? (using swift)

问题描述

我正在尝试使用 PFQueryTableViewController 显示地名列表，包括它的照片.它包含在来自 parse.com

I'm trying to showing a list of place name, including it's photo using PFQueryTableViewController. It's included in ParseUI SDK from parse.com

我已设法显示图像.不幸的是，当我将 UIImageView 模式更改为 Aspect fill 时，图像变得比应有的大.

I have managed to show the image. Unfortunately, when I change the UIImageView mode to Aspect fill, the image is become bigger than it should be.

图片如下:

https://dl.dropboxusercontent.com/u/86529526/pic_normal.pnghttps://dl.dropboxusercontent.com/u/86529526/pic_error.png

在pic_normal 中，您将看到两个单元格，带有两个普通图像.在 pic_error 中，您将第二个单元格被第一个单元格图像覆盖.

in pic_normal, you will see two cell, with two normal image. in pic_error, you will the second cell was being overlaid by the first cell image.

谁能帮我解决这个问题?我也把我的整个代码放在这里:

can anyone help me to solve this problem? I also put my whole code here :

import UIKit

class TableViewController: PFQueryTableViewController, UISearchBarDelegate {

    @IBOutlet var searchBar: UISearchBar!


    // Initialise the PFQueryTable tableview
    override init(style: UITableViewStyle, className: String!) {
        super.init(style: style, className: className)
    }

    required init(coder aDecoder: NSCoder) {
        super.init(coder: aDecoder)

        // Configure the PFQueryTableView
        self.pullToRefreshEnabled = true
        self.paginationEnabled = false
    }

    // Define the query that will provide the data for the table view
    override func queryForTable() -> PFQuery {

        // Start the query object
        var query = PFQuery(className: "Places")

        // query with pointer
        query.includeKey("mainPhoto")

        // Add a where clause if there is a search criteria
        if searchBar.text != "" {
            query.whereKey("name", containsString: searchBar.text)
        }

        // Order the results
        query.orderByAscending("name")

        // Return the qwuery object
        return query
    }


    //override func tableView(tableView: UITableView, cellForRowAtIndexPath indexPath: NSIndexPath) -> UITableViewCell
    override func tableView(tableView: UITableView, cellForRowAtIndexPath indexPath: NSIndexPath, object: PFObject) -> PFTableViewCell? {
        var cell = tableView.dequeueReusableCellWithIdentifier("CustomCell") as! CustomTableViewCell!
        if cell == nil {
            cell = CustomTableViewCell(style: UITableViewCellStyle.Default, reuseIdentifier: "CustomCell")
        }

        // Extract values from the PFObject to display in the table cell
        if let name = object["name"] as? String{
            cell.name.text = name
        }

        // display initial image
        var initialThumbnail = UIImage(named: "question")
        cell.photo.image = initialThumbnail


        // extract image from pointer
        if let pointer = object["mainPhoto"] as? PFObject {
            cell.detail.text = pointer["photoTitle"] as? String!
            if let thumbnail = pointer["photo"] as? PFFile {
                cell.photo.file = thumbnail
                cell.photo.loadInBackground()
            }
        }
        cell.sendSubviewToBack(cell.photo)

        // return the cell
        return cell
    }




    // In a storyboard-based application, you will often want to do a little preparation before navigation
    override func prepareForSegue(segue: UIStoryboardSegue, sender: AnyObject?) {

        // Get the new view controller using [segue destinationViewController].
        var detailScene = segue.destinationViewController as! DetailViewController

        // Pass the selected object to the destination view controller.
        if let indexPath = self.tableView.indexPathForSelectedRow() {
            let row = Int(indexPath.row)
            detailScene.currentObject = objects[row] as? PFObject
        }
    }

    override func viewDidLoad(){
        super.viewDidLoad()
        let tapGesture = UITapGestureRecognizer(target:self, action:Selector("hideKeyboard"))
        tapGesture.cancelsTouchesInView = true
        tableView.addGestureRecognizer(tapGesture)
    }

    func hideKeyboard(){
        tableView.endEditing(true)
    }

    override func viewDidAppear(animated: Bool) {

        // Refresh the table to ensure any data changes are displayed
        tableView.reloadData()

        // Delegate the search bar to this table view class
        searchBar.delegate = self
    }

    func searchBarTextDidEndEditing(searchBar: UISearchBar) {

        // Dismiss the keyboard
        searchBar.resignFirstResponder()

        // Force reload of table data
        self.loadObjects()
    }

    func searchBarSearchButtonClicked(searchBar: UISearchBar) {

        // Dismiss the keyboard
        searchBar.resignFirstResponder()

        // Force reload of table data
        self.loadObjects()
    }

    func searchBarCancelButtonClicked(searchBar: UISearchBar) {

        // Clear any search criteria
        searchBar.text = ""

        // Dismiss the keyboard
        searchBar.resignFirstResponder()

        // Force reload of table data
        self.loadObjects()
    }

}

推荐答案

在内容模式设置为 Aspect Fill 的情况下，也尝试将剪辑的 bounds 设置为 true，原因是内容模式 纵横比填充 继续填充图像视图的框架，直到框架被内容完全填满，同时保持纵横比 完整.在以图像保持纵横比填充容器的过程中，垂直或水平框架被完全填充，并且填充继续直到另一个(如果水平比垂直或反之亦然)部分被完全填充.因此，垂直或水平的第一个填充部分将超出边界，并且内容将在图像视图的框架外可见.要剪辑额外的内容，我们需要使用设置为 true

With content mode set to Aspect Fill, try setting clips to bounds to true as well, reason being the content mode aspect fill keeps on filling the frame of the image view till the frame is fully filled with content also keeping the aspect ratio intact. In the process of filling the container with image maintaining aspect ratio, either vertical or horizontal frame is fully filled, and the filling is continued till the other (if horizontal than vertical or vise versa) portion is fully filled. Thus the first filled portion either across vertical or horizontal will go out of bounds and the content will be visible outside the frame of the image view. To clip the extra content we need to clip the extra portion using imageView's clipsToBounds property set to true

cell.photo.contentMode = UIViewContentMode.ScaleAspectFill
cell.photo.clipsToBounds = true

这篇关于为什么缩放以填充比 UIImageVIew 尺寸更大的图像?(使用迅捷)的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！