When using JSQMessagesViewController as detailView in UISplitviewCOntroller, KeyBoardToolBar needs to appear in DetailViewController only

Question

When using JSQMessagesViewController as detailView in UISplitViewController, KeyBoardToolBar needs to appear in DetailViewController only

Answer 1

late answer...

if u want to reduce the inputToolbar you need to create a subclass of JSQMessagesToolbarContentView and provide your own view for the tool bar's content view.

below i am giving the sample example, create a subcalss of JSQMessagesToolbarContentView name it as JSQMessagesToolbarContentView_custom in the subcalss add below code,

#import "JSQMessagesToolbarContentView.h"

@interface JSQMessagesToolbarContentView_custom : JSQMessagesToolbarContentView
@property (weak, nonatomic) IBOutlet NSLayoutConstraint *holderViewLeadingConstraint;
@end

and in JSQMessagesToolbarContentView_custom.m file,

#import "UIView+JSQMessages.h"
#import "JSQMessagesToolbarContentView_custom.h"

@implementation JSQMessagesToolbarContentView_custom

+ (UINib *)nib
{
      return [UINib nibWithNibName:NSStringFromClass([JSQMessagesToolbarContentView_custom class])
                      bundle:[NSBundle bundleForClass:[JSQMessagesToolbarContentView_custom class]]];
}

#pragma mark - Initialization

- (void)awakeFromNib
{
   [super awakeFromNib];
   [self setTranslatesAutoresizingMaskIntoConstraints:NO];
   self.backgroundColor = [UIColor clearColor];
}

//below method will place the contentview to desired position 
- (void)layoutSubviews
{
   [super layoutSubviews];
   self.holderViewLeadingConstraint.constant = 320;
}

#pragma mark - Setters

- (void)setBackgroundColor:(UIColor *)backgroundColor
{
   [super setBackgroundColor:backgroundColor];
   self.leftBarButtonContainerView.backgroundColor = backgroundColor;
   self.rightBarButtonContainerView.backgroundColor = backgroundColor;
}

- (void)setLeftBarButtonItem:(UIButton *)leftBarButtonItem
{
   [super setLeftBarButtonItem:leftBarButtonItem];  
}

- (void)setLeftBarButtonItemWidth:(CGFloat)leftBarButtonItemWidth
{  
   // self.leftBarButtonContainerViewWidthConstraint.constant = leftBarButtonItemWidth;
   [self setNeedsUpdateConstraints];
}

- (void)setRightBarButtonItem:(UIButton *)rightBarButtonItem
{
   [super setRightBarButtonItem:rightBarButtonItem]; 
}

- (void)setRightBarButtonItemWidth:(CGFloat)rightBarButtonItemWidth
{  
   //  self.rightBarButtonContainerViewWidthConstraint.constant = rightBarButtonItemWidth;
   [self setNeedsUpdateConstraints];
}

- (void)setRightContentPadding:(CGFloat)rightContentPadding
{
   // self.rightHorizontalSpacingConstraint.constant = rightContentPadding;
  [self setNeedsUpdateConstraints];
}

- (void)setLeftContentPadding:(CGFloat)leftContentPadding
{
   //  self.leftHorizontalSpacingConstraint.constant = leftContentPadding;
   [self setNeedsUpdateConstraints];
}

#pragma mark - UIView overrides

- (void)setNeedsDisplay
{
    [super setNeedsDisplay];
    [self.textView setNeedsDisplay];
}


//return the custom view that we are going to create next 
- (JSQMessagesToolbarContentView_custom *)loadToolbarContentView
{
   NSArray *nibViews = [[NSBundle bundleForClass:[JSQMessagesToolbarContentView_custom class]] loadNibNamed:NSStringFromClass([JSQMessagesToolbarContentView_custom class])  owner:nil  options:nil];
  return nibViews.firstObject;
}

after this you need to create add new .xib file name it as JSQMessagesToolbarContentView_custom.xib this file contains our small content view for the inputToolbar and more importantly set the out let connections as doing the demo example and aslo set the view class name to JSQMessagesToolbarContentView_custom . hear i can only add image of the custom view.

now create a outlet for leading constraint to reduce the size of the content view as give below,

and add the constraints outlet's as given in the demo. so if u add some constrians without modifying the base class it will give error or runtime error so edit the base class also

now go to JSQMessagesToolbarContentView.h and add the blow properties form JSQMessagesToolbarContentView.m just cut and past and make it public.

@interface JSQMessagesToolbarContentView : UIView

@property (weak, nonatomic) IBOutlet NSLayoutConstraint *leftBarButtonContainerViewWidthConstraint;


@property (weak, nonatomic) IBOutlet NSLayoutConstraint *rightBarButtonContainerViewWidthConstraint;

@property (weak, nonatomic) IBOutlet NSLayoutConstraint *leftHorizontalSpacingConstraint;
@property (weak, nonatomic) IBOutlet NSLayoutConstraint *rightHorizontalSpacingConstraint;

//...rest of the code 

now in the JSQMessagesInputToolbar.m file, in order to make the tool bar transperent for half of the splitview,

- (void)awakeFromNib
{
    [super awakeFromNib];
     //...rest of the code
    [self setBackgroundImage:[UIImage new]//imageNamed:@"topbar"]
              forToolbarPosition:UIToolbarPositionAny
                      barMetrics:UIBarMetricsDefault];
    [self setShadowImage:[UIImage new] forToolbarPosition:UIBarPositionAny];
    [self setBackgroundColor:[UIColor clearColor]];

}

thats it now run the project, and change the leading constraints constant you see below output,