Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Text only input bar #148

Open
realsurfer opened this issue Jun 9, 2016 · 8 comments
Open

Text only input bar #148

realsurfer opened this issue Jun 9, 2016 · 8 comments

Comments

@realsurfer
Copy link

Hi,

What is the recommendation if I only want to use text input and have the text input field next to the send button just like in the Badoo app? I will need to create my own chat input view?

Thanks
Michael

@diegosanchezr
Copy link
Contributor

Yes, if your design is completely different it's better to create your own view. Hopefully, you can reuse ExpandableTextView though

@makoni
Copy link
Contributor

makoni commented Jun 10, 2016

Could you provide an example of custom chat input view?

I nedd to customize inputs, textfield (including textfield background color) and elements positions (inputs view, textview and send button)

It looks like ChatInputBarAppearance doesn't have options for changing send button tint color and textfield background so I'm looking for elegant way to customize the whole input section.

@diegosanchezr
Copy link
Contributor

I don't have any examples sorry.

You can try to make all the changes needed so it can be configured to your needs. If the solution is generic enough and you think others can benefit from it then that would be a nice PR.

Otherwise, you need to create your own UIView and provide it in createChatInputView. If you find BasicChatInputBarPresenter, ChatInputItemProtocol and company useful then another thing that can be done is abstract ChatInputBar under a protocol so you can inject your own view and still reuse all those classes.

Another alternative would be instantiating ChatInputBar from your own xib.

@makoni
Copy link
Contributor

makoni commented Jun 15, 2016

Well, I tried to make my own xib, but it's not enough. It uses a lot of custom UI classes that has a lot of private methods and private properties. And adding framework via Carthage doesn't allow you to use them.

Subclassing them wasn't success because Xcode says that overriding methods even from public extensions is not supported yet.

The only way I found to make it work to copy some classes that ChatBarInput uses to my project to have access to methods and properties, and to create my own ChatBarInput class inside my project (ChattoAdditions.ReusableXibView subclass). I think I've resolved my problem but there's a lot of duplicating code now in project. Maybe I'll find better solution later :)

Thank you @diegosanchezr

@realsurfer
Copy link
Author

Has anything changed regarding this issue with the release of 2.0?

Thanks!

@lkaihua
Copy link

lkaihua commented Nov 23, 2016

I have the same issue. A text-only chatInputBar is a common need from my perspective.

@lkaihua
Copy link

lkaihua commented Nov 23, 2016

To customize the layout of the input bar, my solution is to create a new xib, change necessary subclass and then init the chatInputView with it.

  1. First step, find the original ChatInputBar.xib in ChattoAdditions.Sources.Input. Copy it to your app and rename as DemoChatInputBar.xib.

  2. The next step is to modify the xib as you want in Xcode. After that, open the xib as source code, and add a Demo prefix for customClass={EACH_CLASS_NAME} in [ChatInputBar,ExpandableTextView,HorizontalStackScrollView]. Also replace customModule="ChattoAdditions" with customModule="{YOUR_APP_MODULE}".

  3. Next, define A minimal collection of class as follows:

class DemoChatInputBar : ChatInputBar {
    override class open func loadNib() -> ChatInputBar {
        let nibName = "DemoChatInputBar"
        let view = Bundle.main.loadNibNamed(nibName, owner: nil, options: nil)!.first as! ChatInputBar
        view.translatesAutoresizingMaskIntoConstraints = false
        view.frame = CGRect.zero
        return view
    }
}
class DemoExpandableTextView: ExpandableTextView{}
class DemoHorizontalStackScrollView: HorizontalStackScrollView {}
  1. Last step, using the new DemoChatInput in your DemoChatViewController:
override func createChatInputView() -> UIView {
        // replace original Nib
        // let chatInputView = ChatInputBar.loadNib()
        let chatInputView = DemoChatInputBar.loadNib()
        ... ... 
}

This works for xcode 8.1 and swift 3.0 and hope this tip could be helpful for you.

As I move on, the customization calls for change in the source code of ChattoAdditions. For example, to delegate the return button of textView keyboard, developers have to access and also edit func in extension ChatInputBar: UITextViewDelegate {}.

Thus I suggest to change these functions from public level to open.

BTW it corresponds with what @makoni mentioned:

Subclassing them wasn't success because Xcode says that overriding methods even from public extensions is not supported yet.

@raincreatives
Copy link

raincreatives commented Jan 7, 2017

To customize input bar, in my opinion, don't use chattoadditions.
After inpmort chataddition source code. can customize input bar from xib. It's not so difficult.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

5 participants