Use the content sharing widget at scope to share

Source: Internet
Author: User

In the latest scope widget, there is a new content sharing widget. We can use this widget to share our images to information, facebook,twitter and other channels. For example, in our scope preview, click the Share button on the image to share our content.





Its design is also very simple and clear.

We're still downloading the code from the exercises we've done:

$ git clone https://github.com/liu-xiao-guo/scopetemplates_comment_input

1) Add a new picture resource Query.cpp
void Query::p ushresult (sc::searchreplyproxy const& reply, const string renderer, int i) {str    Ingstream SS;    SS << I;    String str = SS.STR (); Auto cat = reply->register_category ("id" + str, "Template" + str, "", SC::CA    Tegoryrenderer (renderer));    Sc::categorisedresult R (CAT);    R.set_uri (Uri.tostdstring ()); R.set_art (Images_[0].tostdstring ());//R.set_art ("Http://api.map.baidu.com/images/weather/night/leizhenyu.png")    ;    r["subtitle"] = "subtitle" + str;    R.set_title ("title" + str);    r["Summary"] = "Summary:" + str;    r["Fulldesc"] = "FULLDESC:" + str;    r["mascot"] = Icons_[0].tostdstring ();    r["emblem"] = icons_[1].tostdstring ();    r["background"] = background_.tostdstring ();    r["Overlay-color"] = "#FF0000";    r["Comment_icon"] = icons_[3].tostdstring ();    r["Share_icon"] = icons_[4].tostdstring ();    r["share_pic"] = icons_[5].tostdstring (); QString likes = QString("%1%2"). Arg (Qstr (U8 "\u261d"), "100");    QString views = QString ("%1%2"). Arg (Qstr (U8 "\u261f"), "99");    std::string both = Qstr ("%1%2"). Arg (likes,views). tostdstring ();    Sc::variantbuilder Builder;    Builder.add_tuple ({{"Value", Variant (both)}});    Builder.add_tuple ({{"Value", Variant ("")}});    r["attributes"] = Builder.end ();    r["Musicsource"] = "http://qqmp3.djwma.com/mp3/magic sound God according to the need for Sihuo the saw pulled the eardrum will be broken." MP3 ";    r["VideoSource"] = "http://techslides.com/demos/sample-videos/small.mp4";    r["screenshot"] = Icons_[2].tostdstring ();    Add an array to show the gallary of it sc::variantarray arr;    for (const auto &datum:icons_) {arr.push_back (Variant (datum.tostdstring ()));    } r["Array"] = Sc::variant (arr); if (!reply->push (r)) return;} void Query::p ushresult (sc::searchreplyproxy const& reply, const std::shared_ptr<const Categor    y> *cat, int i) {StringStream ss;    SS << I; String str = SS.STR ();    Sc::categorisedresult R (*cat);    R.set_uri (Uri.tostdstring ());    R.set_art (Images_[i].tostdstring ());    r["subtitle"] = "subtitle" + str;    R.set_title ("title" + str);    r["Summary"] = "Summary:" + str;    r["Fulldesc"] = "FULLDESC:" + str;    r["mascot"] = Icons_[0].tostdstring ();    r["emblem"] = icons_[1].tostdstring ();    r["Comment_icon"] = icons_[3].tostdstring ();    r["Share_icon"] = icons_[4].tostdstring ();    r["share_pic"] = icons_[5].tostdstring ();    QString likes = QString ("%1%2"). Arg (Qstr (U8 "\u261d"), "100");    QString views = QString ("%1%2"). Arg (Qstr (U8 "\u261f"), "99");    std::string both = Qstr ("%1%2"). Arg (likes,views). tostdstring ();    Sc::variantbuilder Builder;    Builder.add_tuple ({{"Value", Variant (both)}});    Builder.add_tuple ({{"Value", Variant ("")}});    r["attributes"] = Builder.end ();    r["Musicsource"] = "";    r["VideoSource"] = "";    r["screenshot"] = ""; This was to ensure thePreview can well for the grid/carousel/lists ...    Variantarray arr;    r["array"] = Sc::variant (arr);; if (!reply->push (r)) return;}

We have added two new images above:
    r["Share_icon"] = icons_[4].tostdstring ();    r["share_pic"] = icons_[5].tostdstring ();

Note that the "Share_icon" here is the picture shown in the preview window. It can be different from the photos we actually share. What really defines in "Share_pic" is the picture we want to share. In the actual application, the shared picture can also be an array. Ask the developer to refer to our documentation to practice.

2) Add our widgets to preview Preview.cpp
void Preview::run (SC::P reviewreplyproxy const& Reply) {result result = Previewquerybase::result ();    Columnlayout Layout1col (1); std::vector<std::string> ids = {"Image", "header", "Summary", "tracks", "Videos" , "Gallery_header", "Gallerys", "Reviews", "exp", "Review_input", "Rating_input", "INP    Utid "," img "};//std::vector<std::string> ids = {" inputID "," IMG "};    Previewwidgetlist widgets;    Columnlayout Layout2col (2);    Layout2col.add_column (IDS);    Layout2col.add_column ({});    Columnlayout Layout3col (3);    Layout3col.add_column (IDS);    Layout3col.add_column ({});    Layout3col.add_column ({});    Define the header section SC::P reviewwidget Header ("header", "header");    It has title and a subtitle properties header.add_attribute_mapping ("title", "title");    Header.add_attribute_mapping ("subtitle", "subtitle");    Widgets.emplace_back (header); Define the image SEction SC::P reviewwidget image ("image", "image");    Mapped to the result's art property image.add_attribute_mapping ("source", "art");    Widgets.emplace_back (image);    Define the Summary section SC::P reviewwidget Description ("Summary", "text"); It has a Text property, mapped to the result ' s Description property description.add_attribute_mapping ("text", "Descr    Iption ");    Widgets.emplace_back (description);    Previewwidget Listen ("tracks", "Audio");        {Variantbuilder Builder; Builder.add_tuple ({{"title", Variant ("This is the song title")}, {"Source", Variant (result["MUSICSO        Urce "].get_string (). C_STR ())});    Listen.add_attribute_value ("Tracks", Builder.end ());    } previewwidget Video ("Videos", "video");    Video.add_attribute_value ("Source", Variant (result["VideoSource"].get_string (). C_STR ())); Video.add_attribute_value ("screenshot", Variant (result["screenshot"].get_string (). C_STR ()));    Previewwidget Header_gal ("Gallery_header", "header");    Header_gal.add_attribute_value ("title", Variant ("Gallery files are:"));    Previewwidget Gallery ("Gallerys", "Gallery");    Gallery.add_attribute_mapping ("Sources", "array");    if (result["Musicsource"].get_string (). Length ()! = 0) {widgets.emplace_back (listen);    } if (result["VideoSource"].get_string (). Length ()! = 0) {widgets.emplace_back (video);        } if (result["array"].get_array (). Size ()! = 0) {widgets.emplace_back (Header_gal);    Widgets.emplace_back (gallery);    }//The following shows the review Previewwidget review ("reviews", "reviews");    Variantbuilder Builder; Builder.add_tuple ({{"Author", Variant ("John Doe")}, {"Review", Variant (    "Very good")}, {"rating", Variant (3.5)});    Builder.add_tuple ({{"Author", Variant ("Mr Smith")},                      {"Review", Variant ("Very poor")}, {"rating", Variant (5)}    });    Review.add_attribute_value ("Reviews", Builder.end ());    Widgets.emplace_back (review);    The following shows the expandable Previewwidget expandable ("exp", "expandable");    Expandable.add_attribute_value ("title", Variant ("This was an expandable widget"));    Expandable.add_attribute_value ("Collapsed-widgets", Variant (1));    Previewwidget W1 ("W1", "text");    W1.add_attribute_value ("title", Variant ("Subwidget 1"));    W1.add_attribute_value ("Text", Variant ("A text"));    Previewwidget W2 ("W2", "text");    W2.add_attribute_value ("title", Variant ("Subwidget 2"));    W2.add_attribute_value ("Text", Variant ("A text"));    Expandable.add_widget (W1);    Expandable.add_widget (W2);    Widgets.emplace_back (expandable);    The following shows a review rating-input previewwidget W_review ("Review_input", "rating-input"); W_review.add_attribute_value ("SuBmit-label ", Variant (" Send "));    W_review.add_attribute_value ("Visible", Variant ("Review"));    W_review.add_attribute_value ("Required", Variant ("Review"));    std::string Reply_label = "Reply";    std::string Max_chars_label = "characters max";    W_review.add_attribute_value ("Review-label", Variant (Reply_label + ":" + Max_chars_label));    Widgets.emplace_back (W_review);    The follwing shows a rating rating-input previewwidget w_rating ("Rating_input", "rating-input");    W_rating.add_attribute_value ("Visible", Variant ("rating"));    W_rating.add_attribute_value ("Required", Variant ("rating"));    W_rating.add_attribute_value ("Rating-label", Variant ("please");    Widgets.emplace_back (w_rating);    Previewwidget w_image ("img", "image");    W_image.add_attribute_value ("Source", Variant (result["Share_icon"].get_string (). C_STR ())); Variantmap share_data;//share_data["uri"] = Variant ("http://img2.imgtn.bdimg.com/it/u=442803940,143587648&fm= 21&gp=0.jpg ");    share_data["uri"] = Variant (result["Share_pic"].get_string (). C_STR ());    share_data["Content-type"] = Variant ("pictures");    W_image.add_attribute_value ("Share-data", Sc::variant (Share_data));    Widgets.emplace_back (W_image);    Previewwidget w_commentinput ("inputID", "comment-input");    W_commentinput.add_attribute_value ("Submit-label", Variant ("Post"));    Widgets.emplace_back (W_commentinput);    In the following, fake some comments data qlist<comment> comment_list;    std::string comment_str = "comment";  for (int i = 0; i < 3;        i++) {Comment Comment;        Comment.id = 1.0;        Comment.publishtime = "2015-3-18";        Comment.text = Comment_str;        Comment.text + = std::to_string (i+1);    Comment_list.append (comment);    } int index = 0;        Q_foreach (const Auto & comment, comment_list) {std::string id = "Commentid_" + std::to_string (index++);        Ids.emplace_back (ID); Previewwidget w_comment (id, "commeNT ");        W_comment.add_attribute_value ("comment", Variant (Comment.text));        W_comment.add_attribute_value ("Author", Variant ("author"));        W_comment.add_attribute_value ("Source", Variant (result["Comment_icon"].get_string (). C_STR ()));        W_comment.add_attribute_value ("subtitle", Variant (Comment.publishtime));    Widgets.emplace_back (w_comment);    } layout1col.add_column (IDs);    Reply->register_layout ({layout1col, Layout2col, layout3col}); Reply->push (widgets);}

In the code above, we have added
    Previewwidget w_image ("img", "image");    W_image.add_attribute_value ("Source", Variant (result["Share_icon"].get_string (). C_STR ()));    Variantmap share_data;//    share_data["uri"] = Variant ("http://img2.imgtn.bdimg.com/it/u=442803940,143587648 &fm=21&gp=0.jpg ");    share_data["uri"] = Variant (result["Share_pic"].get_string (). C_STR ());    share_data["Content-type"] = Variant ("pictures");    W_image.add_attribute_value ("Share-data",  sc::variant (Share_data));    Widgets.emplace_back (W_image);

At the same time, we also added the new IMG ID in the following IDs:
    std::vector<std::string> ids = {"Image", "header", "Summary", "tracks",                                    "videos", "Gallery_header", " Gallerys "," Reviews "," exp ",                                     " Review_input "," Rating_input "," inputID "," IMG "};

In this way, when our photos are displayed, a shared button appears at the bottom left of the picture.


Click on our button to share the photos we defined in "Share_pic" above. This photo can also be a photo on the web.
The source code of the whole project is: https://github.com/liu-xiao-guo/scopetemplates_content_sharing


Use the content sharing widget at scope to share

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.