Подтвердить что ты не робот

Добавление представления заголовка в UIWebView, похожее на Safari и статьи

Я хотел бы добавить представление заголовка к UIWebView, аналогичному строке адреса/поиска в MobileSafari и отличным статьям Articles.app от Sophia Teutschler. Точнее, я хотел бы создать представление "вытащить для фиксации" над UIWebView, как в статьях. В статьях используется UIWebView, поэтому это кажется возможным. Есть ли способ сделать это без необходимости встраивать UIWebView в UIScrollView и обновлять его размер все время, как описано в этой статье? По-видимому, мне нужны прокручивающие события, чтобы вести "ориентацию по фиксации", соответственно.

4b9b3361

Ответ 1

После нескольких попыток, я решил пойти с этим решением:

В принципе, я только что добавил заголовок UIView в качестве представления в виде webview.scrollview.

Чтобы избежать перекрытия заголовка браузера:

  • цикл через все [webview.scrollView subviews]
  • найдите самый большой, который должен содержать браузер (остальные для теней и линий)
  • изменить его origin.y

    здесь код:

    CGRect browserCanvas = web.bounds;
    for(int i=0; i< [[web.scrollView subviews] count]; i++)
    {
      UIView* subview = [[web.scrollView subviews] objectAtIndex:i];
      CGRect f = subview.frame;
      NSLog(@"sub %d -> x:%.0f, y:%.0f, w:%.0f, h:%.0f", i, f.origin.x, f.origin.y, f.size.width, f.size.height);
    
      if(f.origin.x == browserCanvas.origin.x && 
         f.origin.y == browserCanvas.origin.y && 
         f.size.width == browserCanvas.size.width && 
         f.size.height == browserCanvas.size.height)
         {
             f.origin.y = header.frame.size.height;
             subview.frame = f;
         }
    }
    
    if(![header superview])
    {
      [web.scrollView addSubview:header];
      [web.scrollView bringSubviewToFront:header];
    }
    

Ответ 2

Я считаю, что лучшим решением является добавление заголовка в качестве подзапроса вашего прокрутки UIWebViews, настройки UIEdgeInsets, а в функции делегата scrollViewDidScroll при необходимости отрегулируйте параметры scrollIndicatorInsets.

Каждое другое найденное мной решение не учитывало индикаторы прокрутки.

Так как для получения правильного поведения у него есть немного сложности, я решил написать класс для обработки всего этого: MMWebViewWithSmartHeader. Это все еще немного грубо по краям, но должно помочь.

Ответ 3

Мне нравится AutoLayout специально, потому что я могу сделать высоту динамика заголовка.

Это мой код, использующий AutoLayout в контроллере с ссылкой "headerView" в виде заголовка и "webView" в webView.

// Function called in ViewDidLoad:
func addHeaderToWebView(){
    // We load the headerView from a Nib
    headerView = NSBundle.mainBundle().loadNibNamed(WebViewHeader.nibName, owner: self, options: nil).first as! WebViewHeader

    headerView.translatesAutoresizingMaskIntoConstraints = false

    webView.scrollView.addSubview(headerView)

    // the constraints
    let topConstraint = NSLayoutConstraint(item: headerView, attribute: .Bottom, relatedBy: .Equal, toItem: webView.scrollView, attribute: .Top, multiplier: 1, constant: 0)
    let leftConstraint = NSLayoutConstraint(item: headerView, attribute: .Leading, relatedBy: .Equal, toItem: webView, attribute: .Leading, multiplier: 1, constant: 0)
    let rightConstraint = NSLayoutConstraint(item: headerView, attribute: .Trailing, relatedBy: .Equal, toItem: webView, attribute: .Trailing, multiplier: 1, constant: 0)

    // we add the constraints
    webView.scrollView.addConstraints([topConstraint])
    webView.addConstraints([leftConstraint, rightConstraint])
}

// Function called in viewWillLayoutSubviews: to update the scrollview of the webView content inset
func updateWebViewScrollViewContentInset(){
    webView.scrollView.contentInset = UIEdgeInsetsMake(headerView.frame.height, 0, 0, 0)
}

Ответ 4

В статьях не может использоваться UIWebView для отображения основного текста статьи. Для выполнения вашей задачи UIScrollView потребуется почти наверняка. Изменение размера его подзаголовков может не понадобиться. Проверьте образцы кода UIScrollView, предоставленные Apple.

Ответ 5

Я не мог сказать точно, но Twitter, похоже, использует UITableView для достижения этого. Возможно, вы можете попытаться поместить свое представление в заголовок табличного представления и ваш контент в ячейке.

Вот интересный пример, на который вы можете подумать - Как сделать табличный вид Pull-To-Reload так же, как Tweetie 2

Ответ 6

Enormego опубликовал несколько примеров кода, чтобы произошла ситуация, которая произошла при обновлении:

https://github.com/enormego/EGOTableViewPullRefresh

Это действительно не так сложно. Вы можете получить панель заголовков Safari/Articles-style в представлении таблицы, просто создав свою панель заголовков и просто добавив ее в свой UITableView как подвью. Я делаю именно это в приложении, над которым я сейчас работаю:

GBSpendingMeter *meterView = [[[GBSpendingMeter alloc] initWithFrame:CGRectMake(0,0,320,44)] autorelease];

// The meterView will appear pinned to the top of the table, similar to a headerView
[self.tableView addSubview:meterView];

Сложная часть наблюдает за событиями прокрутки в таблице (FYI, UITableView является подклассом UIScrollView, поэтому все одинаковые уведомления/обратные вызовы должны работать), но пример кода, с которым я связан, имеет хороший пример того, как это работает.

Ответ 7

Попробуйте следующее:

    UIView *redView = [[UIView alloc] initWithFrame:CGRectMake(0, -100, WIN_WIDTH, 100)];
    redView.backgroundColor = [UIColor redColor];
    self.view.scrollView.contentInset = UIEdgeInsetsMake(100, 0, 0, 0);
    [self.view.scrollView addSubview:redView];
    NSURLRequest *request = [NSURLRequest requestWithURL: [NSURL URLWithString:@"http://www.baidu.com"]];
    [self.view loadRequest:request];