About to give up with IONIC 3 - Simple Native-like chat page not possible

@luukschoen - are you really suggesting that we create another plugin rather than fixing the ionic native keyboard module to work properly on ios with input/text fields?

That doesn’t sound like the right way to go to me, not sure what the point of having an ionic native module is then.

I see your point and agree with most of it. Ionic Team is making impossible possible, I’ve seen tremendous amounts of improvements in a year! Check out the last commit I’m sure it’s not older than 24h. I believe this is the future and I believe they will succeed at it.

They had to deal with complete angular revamp as well…

I also think they shouldn’t focus on desktop like grids split panes etc… before fixing some issues you also keep mentioning.

2 Likes

Thanks for you input (no pun intended) @EralpBay - it’s good to hear that others understand and appreciate my points. I hope they are eventually understood by the ionic team in the same way and addressed.

@Alexmady
I fell some of your pain points. At the same time, I think Chat-UI can be challenging no matter what tech you go for.
Solving bigger problems usually works by splitting and solving smaller ones.
All I can suggest is to be specific when you look for solutions and not least keep on pushing. Keep in mind that the Ionic creators are wizards but not gods.

No definitely not. I said develop on that cordova plugin, by which I meant the Ionic Native Keyboard plugin. My apologies for any confusion. It seems useless to create a new one. If you could work on that plugin we all could benefit from it.

It’s more off an idealistic answer from my behalf. If I really encounter any issues that won’t get resolved, I try to fix them myself (and possibly create a pull request to merge them back into the main repo). I do get your frustration, but it seems rather pointless if you don’t really address the issues yourself (if they don’t get addressed by the Ionic Team). Are there existing issues in the github repo from the Ionic Native Keyboard that address your specific concerns (as @Sujan12 asked in a related topic) ?

I appreciate your point, but the whole reason I am using ionic is so that I
don’t have to get involved in native tech. I have no knowledge of Cordova
or how to write a plugin and anything that I implemented would be something
of an experimentation that ought to really be left to someone with expert
knowledge

Yes - there is a huge amount of information about this issue here - https://github.com/driftyco/ionic/issues/7149#issuecomment-296457305

I hope no one reads this as the Socket.io example code not working. It works perfectly in Ionic 3. You will have to go through a few bug fixes, none of which are show-stoppers. Nic Raboy’s code is a very good example to work with, and his site is full of many other great examples.

As another commenter mentioned, there are no considerable changes to v3 with respect to the issues in the original posts, and a chat app is entirely doable. There will, however, be minor updates and library/module name changes.

It does not work perfectly on ionic 3 on an ios device at all.

Have you built and run this on an iOS device? The chat issues are nothing to do with socket io, they are to do with, as described above the keyboard/ion-input interaction.

Hey,

We get that you’re frustrated. We’ve all been there. But it’s no excuse to forego common decency on the forum.

Also, please don’t @ reference me without code in your post. We’re not here to write your project. If you have specific coding questions, however, we’re here to take a look and help out.

Good luck,
Ryan

Somebody posted a comment in your other thread that included calling $event.preventDefault() in the click handler of the send button. That seems like a pretty important detail that I don’t see in your code.

Hey - I have already attached a link to a github repo with the code - can you take a look at that?

I have tried it and it doesn’t work unfortunately, not when running on an ios device.

I wonder what would happen if the send button wasn’t really a button at all, such as:

<ion-label (click)="sendMessage()">send</ion-label>

I have just copy pasted this code and it seems that ion-label does not generate a click event at all.

I tried this in a scratch project and it did:

<ion-label (click)="labelClicked()">fake button</ion-label>

  labelClicked(): void {
    alert('label clicked');
  }

Worked whether or not the <ion-label> was inside an <ion-item>.

<ion-footer>
	<ion-toolbar>
		<ion-buttons right>
			<button icon-only item-right (mousedown)="sendMessage($event)" id="send-button">
          <ion-icon name="send"></ion-icon>
        </button>
			<ion-label (click)="labelClicked()">fake button</ion-label>
		</ion-buttons>

	</ion-toolbar>
</ion-footer>

It seems like when the label is wrapped by ion-buttons it does not generate the click event but if for example it is just inside the ion-toolbar tag it does

The $64,000 question is whether it is capable of sending the message without having the keyboard drop. If it is, then it seems like everything else can be worked around with styling.

I have just checked, unfortunately the keyboard still drops in the same way.

If you have a look at my test repo the latest commit

entitled “Keyboard stays up but scrolling now broken”

Demonstrates a way to keep the keyboard up. However, although this keeps the keyboard up well, there are other weird side effects as demonstrated by the video and pictures below (tested in ios real device).

Youtube video as we can only upload gifs on here: https://www.youtube.com/watch?v=M3ud-oax7sc&feature=youtu.be

I have exported various still frames from the video to show more clearly the weird intermediate states that are apparent when the keyboard is hidden (keyboard is hidden upon tapping the message area). Interestingly this shows that the suggestion bar is actually lurking around.

Hope this helps to further clarify the issue.